Trắc nghiệm đúng sai Khoa học máy tính 12 chân trời Bài F9: Một số kĩ thuật định kiểu bằng vùng chọn trong CSS

BÀI F9. MỘT SỐ KỸ THUẬT ĐỊNH KIỂU BẰNG VÙNG CHỌN TRONG CSS

Câu 1: Một nhà phát triển web muốn tạo một giao diện đồng nhất bằng cách sử dụng vùng chọn CSS để định kiểu các phần tử trên trang web. Anh ta quyết định sử dụng vùng chọn theo ID để định kiểu cho một phần tử duy nhất và vùng chọn theo class để định kiểu cho nhiều phần tử có chung đặc điểm. Anh ta viết đoạn CSS sau:

Nhận định về đoạn mã css trên:

a. Phần tử có id="header" sẽ có nền màu xanh và chữ màu trắng.
b. Mọi phần tử có class="navbar" sẽ có nền màu xanh và chữ màu trắng.
c. Nếu một phần tử có cả id="header" và class="navbar", nó sẽ có màu nền là xám theo class.
d. Nếu khai báo một quy tắc CSS khác h1 { color: red; }, tiêu đề <h1> bên trong #header sẽ có màu đỏ.

Đáp án:

- A, D đúng

- C, B sai

Câu 2: Một lập trình viên muốn định kiểu danh sách <ul> để có nền màu xám nhạt và căn giữa nội dung. Đồng thời, anh ta muốn các mục danh sách <li> có class "list-item" sẽ có màu xanh và đậm. Anh ta viết đoạn mã CSS sau:

Sau khi kiểm tra trang web, anh ta nhận thấy rằng nội dung bên trong <li> không hoàn toàn căn giữa như mong muốn. Nguyên nhân dẫn đến vấn đề này và cách khắc phục là:

a. Thuộc tính text-align: center; không áp dụng cho thẻ <li>, cần thêm ul li { text-align: center; }
b. Mặc định, danh sách <ul> không thể có nền màu xám, cần thay background bằng background-color
c. Cần thêm display: block; vào .list-item để nội dung <li> có thể căn giữa chính xác
d. CSS trên hoàn toàn chính xác, lỗi có thể do trình duyệt không hỗ trợ đầy đủ

Câu 3: 

Một nhà phát triển đang thiết kế một trang web có nhiều loại cảnh báo khác nhau:

- Cảnh báo quan trọng sử dụng ID #warning, có màu chữ đỏ và in đậm

- Cảnh báo thông thường sử dụng class .alert, có màu chữ cam và in nghiêng

Anh ta viết đoạn mã CSS sau:

Tuy nhiên, trong một số trường hợp, có những cảnh báo đặc biệt cần vừa có màu đỏ vừa có kiểu in nghiêng. Anh ta quyết định sử dụng cả ID và class cho một phần tử:

Vậy, theo quy tắc ưu tiên trong CSS, đoạn cảnh báo này sẽ hiển thị với kiểu chữ là:

a. Chữ màu đỏ, in đậm và in nghiêng vì cả ID và class đều áp dụng
b. Chữ màu cam, in đậm và in nghiêng vì class .alert ghi đè ID
c. Chữ màu cam, chỉ in nghiêng vì class có độ ưu tiên cao hơn ID
d. Chữ màu đỏ, chỉ in đậm vì ID có độ ưu tiên cao hơn class

--------------- Còn tiếp ---------------