Lý thuyết Tin 12 Chân trời sáng tạo Bài F12: Định kiểu CSS cho biểu mẫu
Với tóm tắt lý thuyết Tin học 12 Bài F12: Định kiểu CSS cho biểu mẫu sách Chân trời sáng tạo hay nhất, ngắn gọn sẽ giúp học sinh lớp 12 nắm vững kiến thức trọng tâm, ôn luyện để học tốt môn Tin 12.
Lý thuyết Tin 12 Chân trời sáng tạo Bài F12: Định kiểu CSS cho biểu mẫu
1. Định kiểu cho hộp văn bản:
Các thuộc tính CSS như display và box-sizing có thể thay đổi cách hiển thị của các thành phần trên biểu mẫu. Các phần tử HTML cấp độ block như <header>, <div>, <form>, và các tiêu đề từ <h1> đến <h6> chiếm toàn bộ độ rộng của trang và hiển thị tuần tự trên từng dòng. Để định kiểu cho phần tử cấp độ block trong biểu mẫu, sử dụng giá trị block cho thuộc tính display.
Vùng chọn input[type="text"] định kiểu cho các hộp văn bản nhập liệu. Vùng đệm 10 pixels và đường biên 1 pixel được tính gộp trong tổng chiều rộng 300 pixels của hộp văn bản nhờ giá trị `border-box` của thuộc tính box-sizing. Để làm nổi bật hộp văn bản khi người dùng đặt con trỏ vào, khai báo trạng thái :focus.
Với vùng chọn này, khi người dùng đặt con trỏ vào, hộp văn bản sẽ có đường viền màu xanh. Thuộc tính outline không làm ảnh hưởng đến kích thước và bố cục của hộp văn bản.
2. Định kiểu cho nút tròn, hộp kiểm và nút nhấn:
Để định kiểu cho nút tròn, hộp kiểm và nút nhấn, khai báo vùng chọn bằng tên thẻ kèm thuộc tính type trong cặp ngoặc vuông. 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, với trạng thái được chọn dùng :checked để định kiểu. Nút nhấn có các trạng thái tương tự như siêu liên kết, bao gồm :hover khi con trỏ chuột nằm trên và :active khi đang được nhấn và giữ chuột.
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 đỏ.
Để định kiểu cho nút tròn, hộp kiểm và nút nhãn, em khai báo vùng chọn là tên thẻ kèm thuộc tỉnh type tương ứng đặt trong cặp ngoặc vuông.
Để định kiểu cho trạng thái của các thành phần này, em khai báo vùng chọn là lớp có tên tương ứng với trạng thái như checked, hover, active,...
Xem thêm tóm tắt lý thuyết Tin học lớp 12 Chân trời sáng tạo hay khác:
Lý thuyết Tin học 12 Bài F11: Định kiểu CSS cho bảng và phần tử <div>
Lý thuyết Tin học 12 Bài F13: Dự án tạo trang web (tiếp theo)
Lý thuyết Tin học 12 Bài G1: Nhóm nghề dịch vụ thuộc ngành Công nghệ thông tin
Lý thuyết Tin học 12 Bài G2: Nhóm nghề quản trị thuộc ngành Công nghệ thông tin
Sách VietJack thi THPT quốc gia 2024 cho học sinh 2k6:
Săn shopee giá ưu đãi :
- 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
- Soạn văn 12 (hay nhất) - CTST
- Soạn văn 12 (ngắn nhất) - CTST
- Giải sgk Toán 12 - CTST
- Giải Tiếng Anh 12 Global Success
- Giải sgk Tiếng Anh 12 Smart World
- Giải sgk Tiếng Anh 12 Friends Global
- Giải sgk Vật Lí 12 - CTST
- Giải sgk Hóa học 12 - CTST
- Giải sgk Sinh học 12 - CTST
- Giải sgk Lịch Sử 12 - CTST
- Giải sgk Địa Lí 12 - CTST
- Giải sgk Giáo dục KTPL 12 - CTST
- Giải sgk Tin học 12 - CTST
- Giải sgk Hoạt động trải nghiệm 12 - CTST
- Giải sgk Âm nhạc 12 - CTST