Câu hỏi tự luận mức độ vận dụng Khoa học máy tính 12 ctst bài F12: Định kiểu CSS cho biểu mẫu

Câu 1: 

*Ưu điểm:

+ Tính nhất quán: CSS giúp đảm bảo rằng tất cả các thành phần trong biểu mẫu có kiểu dáng đồng nhất, tạo ra trải nghiệm người dùng mạch lạc.

+ Dễ dàng thay đổi: Chỉ cần thay đổi một tệp CSS, bạn có thể cập nhật kiểu dáng cho toàn bộ biểu mẫu mà không cần thay đổi HTML.

+ Tăng cường khả năng truy cập: CSS cho phép bạn tạo các hiệu ứng trực quan (như hover, focus) giúp người dùng dễ dàng nhận biết các thành phần tương tác.

*Nhược điểm:

+ Khó khăn trong việc gỡ lỗi: Nếu có nhiều lớp CSS phức tạp, việc xác định vị trí vấn đề có thể trở nên khó khăn.

+ Tốc độ tải trang: Việc sử dụng quá nhiều tệp CSS hoặc mã CSS không tối ưu có thể làm chậm tốc độ tải trang.

+ Ảnh hưởng đến trải nghiệm người dùng: Việc định kiểu tốt có thể làm cho biểu mẫu trở nên hấp dẫn và dễ sử dụng hơn, trong khi kiểu dáng kém có thể gây khó chịu và làm giảm khả năng sử dụng.

Câu 2: 

- Sử dụng lớp và ID hợp lý: Tạo các lớp CSS chung cho các thành phần tương tự để giảm thiểu sự lặp lại. Ví dụ, thay vì định kiểu riêng cho mỗi hộp văn bản, bạn có thể tạo một lớp chung cho tất cả:

.input-text {

    width: 100%;

    padding: 10px;

    border: 1px solid #ccc;

}

- Sử dụng CSS preprocessors: Sử dụng SASS hoặc LESS để tổ chức mã CSS theo cách dễ quản lý hơn, cho phép bạn sử dụng biến, mixins và nesting.

- Nén mã CSS: Giảm kích thước tệp CSS bằng cách loại bỏ các khoảng trắng và chú thích không cần thiết.

Câu 3: 

- width: Đặt chiều rộng cho hộp văn bản.

- height: Đặt chiều cao cho hộp văn bản.

- padding: Thay đổi khoảng cách giữa nội dung và viền.

- font-size: Thay đổi kích thước chữ, ảnh hưởng đến tổng thể kích thước của hộp văn bản.

Câu 4: 

Thẻ HTML: Bạn sử dụng thẻ <input> với thuộc tính type="checkbox" để tạo một hộp kiểm trong biểu mẫu.

<input type="checkbox" id="myCheckbox" name="myCheckbox">

<label for="myCheckbox">Nhãn cho hộp kiểm</label>