[KNTT] Trắc nghiệm Khoa học máy tính 12 bài 17: Các mức ưu tiên của bộ chọn

1. Nếu một quy tắc CSS có `!important` và một quy tắc khác có bộ chọn ID áp dụng cho cùng một phần tử, quy tắc nào sẽ được ưu tiên?

A. Quy tắc có bộ chọn ID.

B. Quy tắc có `!important`.

C. Quy tắc nào đến sau.

D. Quy tắc nào có ít thuộc tính hơn.

2. Giả sử bạn có một quy tắc CSS với `color: red !important;` và một quy tắc khác là `p { color: blue; }`. Phần tử `

` sẽ có màu gì?

A. Màu đỏ.

B. Màu xanh dương.

C. Màu đen (mặc định).

D. Phụ thuộc vào vị trí khai báo của các quy tắc.

3. Khi hai quy tắc CSS có cùng mức độ ưu tiên và cùng áp dụng cho một phần tử, quy tắc nào sẽ được ưu tiên?

A. Quy tắc nào được khai báo trước.

B. Quy tắc nào được khai báo sau.

C. Quy tắc nào có bộ chọn cụ thể hơn.

D. Quy tắc nào đến từ tệp CSS bên ngoài.

4. Trong CSS, bộ chọn nào có mức độ ưu tiên cao nhất để áp dụng một thuộc tính cho một phần tử HTML cụ thể?

A. Bộ chọn lớp (class selector)

B. Bộ chọn ID (ID selector)

C. Bộ chọn thuộc tính (attribute selector)

D. Bộ chọn phổ quát (universal selector)

5. Giả sử có ba quy tắc CSS áp dụng cho cùng một phần tử, mỗi quy tắc sử dụng một bộ chọn khác nhau: bộ chọn ID, bộ chọn lớp và bộ chọn phần tử. Quy tắc nào sẽ được áp dụng nếu không có important?

A. Quy tắc sử dụng bộ chọn phần tử.

B. Quy tắc sử dụng bộ chọn lớp.

C. Quy tắc sử dụng bộ chọn ID.

D. Quy tắc nào đến sau cùng sẽ được áp dụng.

6. Bộ chọn kết hợp (combinator selector) như bộ chọn con (`>`) hoặc bộ chọn kế cận (`+`) có độ ưu tiên được tính như thế nào?

A. Chúng có độ ưu tiên bằng 0.

B. Độ ưu tiên của chúng bằng tổng độ ưu tiên của các bộ chọn thành phần.

C. Chúng có độ ưu tiên bằng bộ chọn phần tử.

D. Chúng có độ ưu tiên bằng bộ chọn lớp.

7. Bộ chọn nào có thể được sử dụng để nhắm mục tiêu đến một phần tử dựa trên việc nó có một thuộc tính cụ thể hay không, bất kể giá trị của thuộc tính đó?

A. Bộ chọn lớp (class selector).

B. Bộ chọn phần tử (element selector).

C. Bộ chọn thuộc tính với sự hiện diện của thuộc tính.

D. Bộ chọn ID (ID selector).

8. Tại sao việc sử dụng quá nhiều bộ chọn ID để định kiểu lại không phải là một thực hành tốt trong thiết kế web?

A. Vì bộ chọn ID rất khó viết.

B. Vì bộ chọn ID chỉ áp dụng được cho một phần tử duy nhất.

C. Vì bộ chọn ID có độ ưu tiên quá thấp.

D. Vì chúng làm giảm hiệu suất tải trang.

9. Trong các bộ chọn sau, bộ chọn nào có độ ưu tiên thấp nhất (thường là 0 điểm)?

A. Bộ chọn lớp (class selector).

B. Bộ chọn phần tử (element selector).

C. Bộ chọn phổ quát (universal selector).

D. Bộ chọn thuộc tính (attribute selector).

10. Bộ chọn nào sau đây có độ ưu tiên bằng 10 trong thang điểm tính điểm ưu tiên của CSS?

A. Bộ chọn phần tử (element selector)

B. Bộ chọn ID (ID selector)

C. Bộ chọn lớp (class selector)

D. Bộ chọn thuộc tính (attribute selector)

11. Nếu bạn muốn một quy tắc CSS chỉ áp dụng cho các phần tử có thuộc tính `type` là `text`, bạn sẽ sử dụng bộ chọn nào?

A. `input[type=text]`

B. `input.text`

C. `input#text`

D. `input text`

12. Bộ chọn nào sau đây có độ ưu tiên bằng 0 trong thang điểm tính điểm ưu tiên của CSS?

A. Bộ chọn lớp (class selector)

B. Bộ chọn phần tử (element selector)

C. Bộ chọn phổ quát (universal selector)

D. Bộ chọn ID (ID selector)

13. Bộ chọn nào sau đây có độ ưu tiên cao hơn: `div p` hay `div > p`?

A. `div p` có độ ưu tiên cao hơn vì nó bao gồm nhiều cấp độ.

B. `div > p` có độ ưu tiên cao hơn vì nó cụ thể hơn.

C. Cả hai có độ ưu tiên như nhau.

D. Phụ thuộc vào các quy tắc khác áp dụng.

14. Nếu có hai quy tắc CSS áp dụng cho cùng một phần tử, một quy tắc đến từ tệp CSS bên ngoài và một quy tắc được định nghĩa trong thẻ `` của tệp HTML, quy tắc nào sẽ được ưu tiên nếu chúng có cùng độ ưu tiên về bộ chọn?

A. Quy tắc từ tệp CSS bên ngoài.

B. Quy tắc từ thẻ `` trong tệp HTML.

C. Quy tắc nào đến trước.

D. Quy tắc nào có nhiều thuộc tính CSS được khai báo.

15. Khi tính điểm ưu tiên cho một bộ chọn phức tạp như `body #main .content p`, bạn sẽ cộng điểm như thế nào?

A. Cộng điểm của ID, lớp và phần tử.

B. Lấy điểm cao nhất của các bộ chọn thành phần.

C. Cộng điểm của bộ chọn ID, bộ chọn lớp và bộ chọn phần tử.

D. Cộng điểm của bộ chọn ID và bộ chọn phần tử.

16. Bộ chọn nào sẽ có độ ưu tiên cao hơn: `p { color: red; }` hay `.my-paragraph { color: blue; }`?

A. `p { color: red; }` vì bộ chọn phần tử có độ ưu tiên cao hơn.

B. `.my-paragraph { color: blue; }` vì bộ chọn lớp có độ ưu tiên cao hơn.

C. Cả hai có độ ưu tiên như nhau và quy tắc nào đến sau sẽ được áp dụng.

D. Không thể xác định nếu không biết vị trí khai báo của chúng.

17. Bộ chọn giả lớp (pseudo-class selector) như `:hover` hoặc `:focus` có độ ưu tiên bằng bao nhiêu điểm trong thang tính điểm CSS?

A. 1 điểm

B. 10 điểm

C. 100 điểm

D. 1000 điểm

18. Khi một thuộc tính được khai báo trực tiếp trên một phần tử HTML bằng thuộc tính style, nó được gọi là gì và có mức độ ưu tiên như thế nào?

A. Inline style, có mức độ ưu tiên thấp nhất.

B. Inline style, có mức độ ưu tiên cao nhất.

C. Internal style, có mức độ ưu tiên trung bình.

D. External style, có mức độ ưu tiên cao nhất.

19. Trong CSS, bộ chọn nào cho phép bạn nhắm mục tiêu đến các phần tử dựa trên sự hiện diện hoặc giá trị của một thuộc tính của chúng?

A. Bộ chọn phần tử (element selector).

B. Bộ chọn ID (ID selector).

C. Bộ chọn lớp (class selector).

D. Bộ chọn thuộc tính (attribute selector).

20. Khi nào thì một quy tắc CSS được khai báo sau cùng sẽ ghi đè lên một quy tắc khai báo trước đó có cùng mức độ ưu tiên về bộ chọn?

A. Luôn luôn, bất kể bộ chọn.

B. Chỉ khi quy tắc sau có bộ chọn cụ thể hơn.

C. Khi cả hai quy tắc có cùng độ ưu tiên về bộ chọn và không có `!important`.

D. Chỉ khi quy tắc sau nằm trong tệp CSS riêng biệt.

21. Trong CSS, làm thế nào để tăng độ ưu tiên của một quy tắc CSS lên mức cao nhất, bất kể bộ chọn nào được sử dụng?

A. Thêm từ khóa `auto` vào cuối thuộc tính.

B. Sử dụng bộ chọn ID cho tất cả các phần tử.

C. Thêm từ khóa `!important` vào cuối khai báo thuộc tính.

D. Đặt quy tắc CSS đó vào cuối tệp stylesheet.

22. Tại sao việc sử dụng `!important` trong CSS đôi khi được khuyến khích hạn chế trong các dự án lớn?

A. Vì nó làm giảm hiệu suất tải trang.

B. Vì nó có thể gây ra xung đột và khó khăn trong việc quản lý các quy tắc CSS.

C. Vì các trình duyệt hiện đại không còn hỗ trợ nó.

D. Vì nó chỉ có thể áp dụng cho các phần tử có ID.

23. Nếu một phần tử được kế thừa một thuộc tính từ phần tử cha của nó, điều này liên quan đến cơ chế nào của CSS?

A. Tính cụ thể (Specificity) của bộ chọn.

B. Thừa kế (Inheritance) thuộc tính.

C. Tính quan trọng (Importance) của quy tắc.

D. Cascade (Sự xếp tầng) của các quy tắc.

24. Khi bạn cần áp dụng một kiểu dáng CSS cho một nhóm các phần tử HTML có chung đặc điểm, bạn nên sử dụng loại bộ chọn nào?

A. Bộ chọn phần tử (element selector).

B. Bộ chọn ID (ID selector).

C. Bộ chọn lớp (class selector).

D. Bộ chọn thuộc tính (attribute selector).

25. Trong trường hợp hai quy tắc CSS có cùng độ ưu tiên về bộ chọn và cùng nguồn (ví dụ: cả hai đều từ tệp CSS bên ngoài), quy tắc nào sẽ được áp dụng nếu một quy tắc được khai báo là `color: green !important;` và quy tắc kia là `color: yellow;`?

A. Màu xanh lá cây.

B. Màu vàng.

C. Màu mặc định.

D. Phụ thuộc vào thứ tự khai báo.