Khóa học ngắn hạn CSS
Các tầng là những gì làm cho CSS phong cách tờ rất hữu ích. Tóm lại, các tầng thác xác định thứ tự ưu tiên cho cách áp dụng các kiểu xung đột. Nói cách khác, nếu bạn có hai kiểu:
p {color: đỏ; }
p {color: blue; }
Các tầng xác định màu sắc các đoạn văn phải được, mặc dù phong cách trang nói rằng họ nên được cả hai màu đỏ và màu xanh. Cuối cùng chỉ có một màu có thể được áp dụng cho các đoạn văn, do đó, phải có một trật tự.
Và thứ tự này được áp dụng bởi các bộ chọn (ví dụ p trong ví dụ trên) có mức ưu tiên cao nhất và thứ tự chúng xuất hiện trong tài liệu.
Danh sách sau đây là cách đơn giản hóa cách trình duyệt của bạn quyết định ưu tiên cho một kiểu:
- Tìm trong biểu định kiểu cho bộ chọn khớp với phần tử. Nếu không có kiểu được xác định, hãy sử dụng các quy tắc mặc định trong trình duyệt
- Hãy tìm trong bảng định kiểu cho các bộ chọn được đánh dấu là quan trọng và áp dụng chúng cho các phần tử thích hợp.
- Tất cả các kiểu trong biểu định kiểu sẽ ghi đè kiểu trình duyệt mặc định (trừ trường hợp các trang kiểu người dùng).
- Công cụ chọn kiểu dáng càng cụ thể, độ ưu tiên càng cao. Ví dụ, div> p.class là cụ thể hơn p.class đó là cụ thể hơn p.
- Cuối cùng, nếu hai quy tắc áp dụng cho cùng một phần tử và có cùng ưu tiên bộ chọn, thì quy tắc được tải cuối cùng sẽ được áp dụng. Nói cách khác, bảng định kiểu được đọc từ trên xuống dưới và các kiểu được áp dụng trên đầu trang của nhau.
Dựa trên các quy tắc đó, trong ví dụ trên, các đoạn văn sẽ được viết bằng màu xanh dương, vì p {color: blue; } đến cuối cùng trong bảng định kiểu.
Đây là một lời giải thích rất đơn giản về thác. Nếu bạn quan tâm đến việc tìm hiểu thêm về cách hoạt động của thác, bạn nên đọc "Cascade" có ý nghĩa gì trong Cascading Style Sheets? .