Ưu tiên CSS quan trọng

Bạn đã bao giờ dành một phút để xem xét cách trình phân tích cú pháp css xử lý mức độ ưu tiên của tất cả các khai báo css chưa? . Kiến thức này sẽ giúp bạn tránh được nhiều vấn đề trên đường đi, chẳng hạn như sử dụng css. quy tắc quan trọng

C là viết tắt của Cascading

Bước đầu tiên trong quá trình xử lý CSS là kết hợp các biểu định kiểu khác nhau và giải quyết xung đột giữa các khai báo CSS. quá trình này được gọi là xếp tầng. Có ba nguyên tắc chính và mỗi nguyên tắc có trọng lượng khác nhau ở đây

Tầm quan trọng > Tính đặc hiệu > Thứ tự nguồn

Tầm quan trọng

1. Người dùng. tuyên bố quan trọng
2. Tác giả. tuyên bố quan trọng
3. Tuyên bố tác giả
4. khai báo người dùng
5. Khai báo mặc định được chỉ định bởi trình duyệt

Khai báo của người dùng là khai báo mà người dùng trình duyệt tạo, ví dụ: nếu anh ta thay đổi phông chữ mặc định mà trình duyệt khai báo. Các khai báo của tác giả là những khai báo mà bạn, với tư cách là nhà phát triển, thực hiện. Một quy tắc được gọi là. Quan trọng có thể được thêm vào khai báo của bạn để tăng tầm quan trọng của nó. Ngay cả khi việc sử dụng nó có vẻ hấp dẫn, nó có thể làm hỏng nghiêm trọng khả năng đọc mã của bạn và dẫn đến tình huống sau này trong quá trình phát triển khi bạn muốn thay đổi kiểu của một thứ gì đó và bạn không thể hiểu tại sao nó không hoạt động. Tốt hơn là giải quyết các tình huống như vậy ở mức độ cụ thể

độ đặc hiệu

Nếu hai quy tắc có cùng mức độ quan trọng, thì tính cụ thể sẽ được tính đến. Cách tốt nhất để hiểu nó là tưởng tượng nó như một con số nào đó. Thứ tự các chữ số như sau

1. kiểu nội tuyến
2. ID
3. Các lớp, lớp giả, bộ chọn thuộc tính
4. Phần tử, phần tử giả

Nếu số ID giống nhau thì tính đến số lớp. Nếu điều đó không đủ, số lượng phần tử được xem xét. Ví dụ

#trình bao bọc ứng dụng. bài viết bài viết. di chuột = [0, 1, 2, 1]

Nó không dịch trực tiếp thành số 121 vì thậm chí 11 lớp vẫn ít cụ thể hơn một ID = [0, 1, 11, 1]. Hãy xác định tính đặc hiệu của các bộ chọn khác nhau tại đây

1

2

3