Em hãy liệt kê một số trạng thái của các thành phần trong biểu mẫu

Giải Tin học 12 Bài F12: Định kiểu CSS cho biểu mẫu - Chân trời sáng tạo

Luyện tập 3 trang 172 Tin học 12: Em hãy liệt kê một số trạng thái của các thành phần trong biểu mẫu và nêu cách khai báo vùng chọn để định kiểu cho chúng.

Lời giải:

Nút tròn và hộp kiểm có hai trạng thái cơ bản là được chọn và không được chọn. Để định kiểu cho trạng thái đang được chọn, ta sử dụng trạng thái checked trong vùng chọn.

Nút nhấn có một số trạng thái tương tự như siêu liên kết, trong đó có trạng thái hover là trạng thái đang có con trỏ chuột nằm trên và trạng thái active là trạng thái đang được nháy và giữ chuột.

Đối với nút tròn, khai báo vùng chọn để định kiểu cho trạng thái được chọn:

input[type="radio"]:checked {

background-color: #007bff;

}

Với khai báo này, khi người dùng nháy chọn, nút tròn sẽ được tổ nền màu xanh. Đối với hộp kiếm, khai báo vùng chọn để định kiểu cho trạng thái được chọn: input[type="checkbox"]:checked {

}

accent-color: #007bff;

Với khai báo này, khi người dùng nháy chọn, hộp kiểm sẽ có dạng

Đối với nút, khai báo vùng chọn để định kiểu cho trạng thái hover và active:

button[type="submit"]:hover {

}

background-color: #0056b3;

button[type="submit"]:active {

}

background-color: #ff0000;

Với hai khai báo này, khi người dùng di chuyển con trỏ chuột đến, nút sẽ chuyển sang màu xanh đậm; khi người dùng nhảy và giữ chuột, nút nhấn sẽ chuyển sang màu đỏ.

Lời giải bài tập Tin học 12 Bài F12: Định kiểu CSS cho biểu mẫu hay khác:

• Khởi động trang 170 Tin học 12: Em hãy quan sát và nhận xét một số biểu mẫu khảo sát ....

• Hoạt động trang 171 Tin học 12: Em hãy khai báo vùng chọn dùng để định kiểu cho trạng thái ....

• Hoạt động trang 172 Tin học 12: Trong khai báo vùng chọn của hộp kiểm, em hãy thay đổi thuộc tính ....

• Luyện tập 1 trang 172 Tin học 12: Em hãy trình bày lợi ích khi định kiểu cho biểu mẫu ....

• Luyện tập 2 trang 172 Tin học 12: Ý nghĩa của thuộc tính display và box-sizing là gì? ....

• Thực hành trang 172 Tin học 12: Nhiệm vụ. Định kiểu CSS cho biểu mẫu góp ý ....

• Vận dụng 1 trang 174 Tin học 12: Định kiểu để tạo màu nền chung cho hai nút tròn và màu nền chung cho ba hộp kiểm ....

• Vận dụng 2 trang 174 Tin học 12: Tạo và định kiểu cho biểu mẫu đăng nhập gồm các thành phần sau ....

• Vận dụng 3 trang 174 Tin học 12: Tìm hiểu thêm cách để chèn biểu tượng vào hộp văn bản ....

Xem thêm lời giải bài tập Tin học lớp 12 Chân trời sáng tạo hay nhất, ngắn gọn khác:

• Tin học 12 Bài F11: Định kiểu CSS cho bảng và phần tử <div>

• Tin học 12 Bài F13: Dự án tạo trang web (tiếp theo)

• Tin học 12 Bài G1: Nhóm nghề dịch vụ thuộc ngành Công nghệ thông tin

• Tin học 12 Bài G2: Nhóm nghề quản trị thuộc ngành Công nghệ thông tin

• Tin học 12 Bài G3: Một số nghề ứng dụng tin học và một số ngành thuộc lĩnh vực Công nghệ thông tin

Săn shopee siêu SALE :

• Sổ lò xo Art of Nature Thiên Long màu xinh xỉu
• Biti's ra mẫu mới xinh lắm
• Tsubaki 199k/3 chai
• L'Oreal mua 1 tặng 3

---