Đề bài
Cho bộ chọn dưới đây được khai báo trong phần tử $ < style > $ ở phần $ < head > $ của một trang web viết bằng HTML. Phương án nào cho bên dưới nhận xét đúng về phạm vi áp dụng của bộ chọn đã cho?
Tất cả các phần tử trong trang web.
Tất cả các phần tử có giá trị thuộc tính class là "highlight".
Tất cả các phần tử có định danh (id) là "highlight".
Tất cả các phần tử có tên là "highlight".
Đáp án đúng: B
Xem lời giải
Lời giải chi tiết
Bộ chọn trong đoạn mã CSS trên là .highlight. Ký tự chấm (.) trước tên của bộ chọn cho biết đây là một bộ chọn lớp (class selector). Vì vậy, nó sẽ áp dụng các kiểu đã định nghĩa cho tất cả các phần tử có giá trị thuộc tính class là "highlight".
Phân tích các phương án:
- A. Tất cả các phần tử trong trang web. Sai, vì bộ chọn này chỉ áp dụng cho các phần tử có class là "highlight", không phải tất cả các phần tử trong trang.
- B. Tất cả các phần tử có giá trị thuộc tính class là "highlight". Đúng, vì bộ chọn class chỉ áp dụng cho các phần tử với class đã được chỉ định.
- C. Tất cả các phần tử có định danh (id) là "highlight". Sai, vì để áp dụng cho id, bộ chọn phải sử dụng ký hiệu # thay vì .
- D. Tất cả các phần tử có tên là "highlight". Sai, vì bộ chọn này không tìm kiếm theo tên phần tử (tag name) mà theo class.
Vì vậy, phương án đúng là: B. Tất cả các phần tử có giá trị thuộc tính class là "highlight".
Chú ý khi giải
Khi làm việc với CSS:
- Hiểu rõ ký hiệu của bộ chọn: "." cho class, "#" cho id.
- Phân biệt sự khác nhau giữa class và id: Class dùng cho nhiều phần tử, id chỉ cho duy nhất một phần tử trên trang.
- Chú ý đến cấu trúc HTML và đảm bảo các thuộc tính class và id được đặt một cách chính xác để áp dụng đúng kiểu.