Bộ 30+ câu hỏi trắc nghiệm Bộ chọn (Selectors) và Độ ưu tiên trong CSS. Cùng rèn luyện kiến thức CSS online ngay nhé.
1. Điều gì xảy ra khi có một quy tắc CSS được khai báo trong một file CSS bên ngoài và một quy tắc khác được khai báo trong thuộc tính style inline cho cùng một phần tử?
A. Quy tắc trong file CSS bên ngoài sẽ được áp dụng.
B. Quy tắc trong thuộc tính style inline sẽ được áp dụng.
C. Cả hai quy tắc sẽ được áp dụng, và thuộc tính style inline sẽ ghi đè các thuộc tính trùng lặp.
D. Cả hai quy tắc sẽ được áp dụng, và quy tắc trong file CSS bên ngoài sẽ ghi đè các thuộc tính trùng lặp.
2. Nếu một thuộc tính CSS được khai báo nhiều lần cho cùng một phần tử với cùng độ ưu tiên, thuộc tính nào sẽ được áp dụng?
A. Thuộc tính được khai báo đầu tiên.
B. Thuộc tính được khai báo sau cùng.
C. Thuộc tính được khai báo trong file CSS ngoài.
D. Thuộc tính được khai báo trong thuộc tính style inline.
3. Trong CSS, độ ưu tiên của bộ chọn được tính toán như thế nào?
A. Bằng cách đếm số lượng bộ chọn trong một quy tắc.
B. Bằng cách gán trọng số cho từng loại bộ chọn và tính tổng.
C. Dựa trên thứ tự các bộ chọn trong file CSS.
D. Dựa trên kích thước của file CSS.
4. Điều gì xảy ra khi có nhiều quy tắc CSS xung đột áp dụng cho cùng một phần tử?
A. Quy tắc CSS được khai báo đầu tiên sẽ được áp dụng.
B. Quy tắc CSS được khai báo sau cùng sẽ được áp dụng.
C. Trình duyệt sẽ chọn ngẫu nhiên một quy tắc để áp dụng.
D. Quy tắc CSS có độ ưu tiên cao nhất sẽ được áp dụng.
5. Khi nào thuộc tính style inline nên được sử dụng?
A. Luôn luôn để đảm bảo kiểu dáng được áp dụng.
B. Chỉ khi cần ghi đè các quy tắc CSS khác và có lý do chính đáng.
C. Khi không có file CSS bên ngoài.
D. Để làm cho mã CSS dễ đọc hơn.
6. Tại sao nên sử dụng lớp thay vì ID để tạo kiểu cho nhiều phần tử?
A. Vì ID có độ ưu tiên cao hơn.
B. Vì lớp có hiệu suất tốt hơn.
C. Vì ID chỉ nên được sử dụng cho một phần tử duy nhất trên trang, trong khi lớp có thể được sử dụng cho nhiều phần tử.
D. Vì lớp dễ sử dụng hơn.
7. Điều gì xảy ra khi một phần tử có cả lớp và ID, và cả hai đều được sử dụng trong CSS?
A. Chỉ lớp được áp dụng.
B. Chỉ ID được áp dụng.
C. Cả hai đều được áp dụng, ID ghi đè lớp nếu có xung đột.
D. Cả hai đều được áp dụng, lớp ghi đè ID nếu có xung đột.
8. Bộ chọn nào sau đây có độ ưu tiên thấp nhất trong CSS?
A. Bộ chọn ID
B. Bộ chọn lớp
C. Bộ chọn tên phần tử
D. Thuộc tính style inline
9. Bộ chọn nào sau đây được sử dụng để chọn một phần tử duy nhất trên trang?
A. Tên phần tử
B. Lớp
C. ID
D. Thuộc tính
10. Quy tắc nào sau đây được áp dụng khi có xung đột giữa các quy tắc CSS?
A. Quy tắc CSS được định nghĩa đầu tiên.
B. Quy tắc CSS được định nghĩa sau cùng.
C. Quy tắc CSS có độ ưu tiên cao hơn.
D. Quy tắc CSS ngắn gọn nhất.
11. Trong CSS, bộ chọn nào sau đây có độ ưu tiên cao hơn bộ chọn lớp?
A. Bộ chọn tên phần tử
B. Bộ chọn lớp khác
C. Bộ chọn ID
D. Bộ chọn thuộc tính
12. Khi nào nên sử dụng !important trong CSS?
A. Luôn luôn để đảm bảo kiểu dáng được áp dụng.
B. Chỉ khi cần ghi đè các quy tắc CSS từ thư viện hoặc framework bên ngoài và không thể thay đổi chúng.
C. Khi không có file CSS bên ngoài.
D. Để làm cho mã CSS dễ đọc hơn.
13. Tại sao việc hiểu rõ độ ưu tiên của bộ chọn CSS lại quan trọng?
A. Để viết mã CSS nhanh hơn.
B. Để trình duyệt hiển thị trang web nhanh hơn.
C. Để kiểm soát chính xác cách các quy tắc CSS được áp dụng và tránh các xung đột không mong muốn.
D. Để làm cho mã CSS dễ đọc hơn.
14. Thuộc tính style inline có độ ưu tiên như thế nào so với các bộ chọn khác?
A. Thấp hơn tất cả các bộ chọn khác.
B. Cao hơn bộ chọn ID nhưng thấp hơn bộ chọn lớp.
C. Cao hơn bộ chọn lớp nhưng thấp hơn bộ chọn ID.
D. Cao nhất trong tất cả các bộ chọn.
15. Bộ chọn nào sau đây có thể được sử dụng để chọn phần tử có id là 'title'?
A. title
B. p
C. class
D. attribute
16. Bộ chọn nào sau đây có thể được sử dụng để chọn tất cả các phần tử có thuộc tính title với giá trị là 'example'?
A. title
B. p
C. id
D. attribute
17. Bộ chọn nào sau đây có thể được sử dụng để chọn tất cả các phần tử có cả lớp 'highlight' và lớp 'bold'?
A. highlight bold
B. highlight, bold
C. highlight.bold
D. highlight+bold
18. Trong CSS, điều gì xảy ra nếu một phần tử có nhiều lớp và các lớp này có các quy tắc xung đột?
A. Chỉ lớp đầu tiên được áp dụng.
B. Chỉ lớp cuối cùng được áp dụng.
C. Các quy tắc được trộn lẫn và áp dụng theo thứ tự chúng xuất hiện.
D. Các quy tắc từ lớp được khai báo sau cùng sẽ ghi đè các quy tắc từ các lớp trước đó.
19. Bộ chọn nào trong CSS có độ ưu tiên cao nhất?
A. Bộ chọn tên phần tử
B. Bộ chọn lớp
C. Bộ chọn ID
D. Bộ chọn thuộc tính
20. Điều gì sẽ xảy ra nếu hai bộ chọn cùng độ ưu tiên áp dụng cho một phần tử?
A. Quy tắc được khai báo đầu tiên trong CSS sẽ được áp dụng.
B. Quy tắc được khai báo sau cùng trong CSS sẽ được áp dụng.
C. Trình duyệt sẽ chọn ngẫu nhiên một quy tắc để áp dụng.
D. Không có quy tắc nào được áp dụng.
21. Bộ chọn nào sau đây có thể được sử dụng để chọn tất cả các phần tử có thuộc tính title?
A. title
B. p
C. id
D. attribute
22. Bộ chọn nào sau đây được sử dụng để chọn tất cả các phần tử thuộc một lớp cụ thể?
A. Tên phần tử
B. ID
C. Lớp
D. Thuộc tính
23. Bộ chọn nào sau đây được sử dụng để chọn một phần tử dựa trên giá trị của một thuộc tính?
A. Bộ chọn tên phần tử
B. Bộ chọn lớp
C. Bộ chọn ID
D. Bộ chọn thuộc tính
24. Điều gì sẽ xảy ra nếu bạn sử dụng cùng một ID cho nhiều phần tử trên một trang?
A. Trình duyệt sẽ hiển thị một thông báo lỗi.
B. Chỉ phần tử đầu tiên có ID đó sẽ được tạo kiểu.
C. Tất cả các phần tử có ID đó sẽ được tạo kiểu.
D. Hành vi không xác định và có thể khác nhau giữa các trình duyệt.
25. Bộ chọn nào sau đây có thể được sử dụng để chọn tất cả các phần tử có thuộc tính data-theme là 'dark'?
A. data-theme
B. p
C. id
D. attribute
26. Bộ chọn nào sau đây có thể được sử dụng để chọn phần tử có lớp là 'highlight'?
A. highlight
B. id
C. p
D. attribute
27. Trong CSS, độ ưu tiên được tính dựa trên yếu tố nào?
A. Thứ tự các quy tắc trong bảng định kiểu.
B. Mức độ cụ thể của bộ chọn.
C. Thời gian tạo các quy tắc.
D. Kích thước của các quy tắc.
28. Bộ chọn nào sau đây có thể được sử dụng để chọn tất cả các phần tử p?
A. p
B. id
C. class
D. attribute
29. Trong CSS, điều gì xảy ra nếu bạn khai báo một thuộc tính với giá trị !important?
A. Thuộc tính sẽ bị bỏ qua.
B. Thuộc tính sẽ được áp dụng bất kể độ ưu tiên của các bộ chọn khác.
C. Thuộc tính sẽ chỉ được áp dụng nếu không có các quy tắc CSS khác.
D. Thuộc tính sẽ được áp dụng với độ ưu tiên thấp nhất.
30. Tại sao nên hạn chế sử dụng thuộc tính style inline?
A. Vì nó làm tăng kích thước file HTML.
B. Vì nó làm giảm hiệu suất của trình duyệt.
C. Vì nó làm giảm tính bảo trì và khả năng tái sử dụng của mã CSS.
D. Vì nó không được hỗ trợ bởi tất cả các trình duyệt.
Võ Việt Hoàng SEO
Võ Việt Hoàng SEO