Bộ quy tắc CSS bao gồm

khai báo CSS

Đặt các thuộc tính CSS thành các giá trị cụ thể là chức năng cốt lõi của ngôn ngữ CSS. Một cặp thuộc tính và giá trị được gọi là một khai báo và bất kỳ công cụ CSS nào cũng sẽ tính toán những khai báo nào áp dụng cho từng thành phần của trang để bố trí và tạo kiểu cho nó một cách thích hợp

Cả thuộc tính và giá trị đều không phân biệt chữ hoa chữ thường theo mặc định trong CSS. Cặp được phân tách bằng dấu hai chấm, ':' (U+003A COLON) và các khoảng trắng trước, giữa và sau các thuộc tính và giá trị, nhưng không nhất thiết phải ở bên trong, được bỏ qua

Có hơn 100 thuộc tính khác nhau trong CSS và gần như vô số giá trị khác nhau. Không phải tất cả các cặp thuộc tính và giá trị đều được phép và mỗi thuộc tính xác định giá trị hợp lệ là gì. Khi một giá trị không hợp lệ cho một thuộc tính nhất định, khai báo được coi là không hợp lệ và hoàn toàn bị công cụ CSS bỏ qua

khối khai báo CSS

Các khai báo được nhóm thành các khối, đó là trong một cấu trúc được phân định bằng dấu ngoặc mở, '{' (U+007B LEFT CURLY BRACKET), và dấu đóng, '}' (h1 { color: blue; margin-top: 1em; }
p { padding: 5px; }
td { background-color: #ddd; }0). Các khối đôi khi có thể được lồng vào nhau, vì vậy các dấu ngoặc mở và đóng phải khớp với nhau

Các khối như vậy được gọi một cách tự nhiên là các khối khai báo và các khai báo bên trong chúng được phân tách bằng dấu chấm phẩy, 'h1 { color: blue; margin-top: 1em; }
p { padding: 5px; }
td { background-color: #ddd; }1' (h1 { color: blue; margin-top: 1em; }
p { padding: 5px; }
td { background-color: #ddd; }2). Một khối khai báo có thể trống, có chứa khai báo null. Khoảng trắng xung quanh khai báo được bỏ qua. Phần khai báo cuối cùng của một khối không cần phải kết thúc bằng dấu chấm phẩy, mặc dù nó thường được coi là cách tốt để làm điều đó vì nó tránh việc quên thêm nó khi mở rộng khối bằng một phần khai báo khác

Một khối khai báo CSS được hiển thị trong sơ đồ bên dưới

Ghi chú. Nội dung của khối khai báo CSS, đó là danh sách các khai báo được phân tách bằng dấu chấm phẩy, không có dấu ngoặc nhọn mở đầu và dấu ngoặc nhọn đóng, có thể được đặt bên trong thuộc tính h1 { color: blue; margin-top: 1em; }
p { padding: 5px; }
td { background-color: #ddd; }3 của HTML

bộ quy tắc CSS

Nếu các biểu định kiểu chỉ có thể áp dụng một khai báo cho từng thành phần của trang Web, thì chúng sẽ khá vô dụng. Mục tiêu thực sự là áp dụng các khai báo khác nhau cho các phần khác nhau của tài liệu

CSS cho phép điều này bằng cách liên kết các điều kiện với các khối khai báo. Mỗi khối khai báo (hợp lệ) được đặt trước bởi một hoặc nhiều bộ chọn được phân tách bằng dấu phẩy, là các điều kiện chọn một số thành phần của trang. Một nhóm bộ chọn và một khối khai báo liên quan, cùng nhau, được gọi là một bộ quy tắc hoặc thường là một quy tắc

Một bộ quy tắc CSS (hoặc quy tắc) được hiển thị trong sơ đồ bên dưới

Vì một phần tử của trang có thể được so khớp bởi một số bộ chọn và do đó, theo một số quy tắc có khả năng chứa một thuộc tính nhất định nhiều lần, với các giá trị khác nhau, nên tiêu chuẩn CSS xác định cái nào được ưu tiên hơn cái kia và phải được áp dụng. đây được gọi là thuật toán xếp tầng

Ghi chú. Điều quan trọng cần lưu ý là ngay cả khi một bộ quy tắc được đặc trưng bởi một nhóm bộ chọn là một loại tốc ký thay thế các bộ quy tắc bằng một bộ chọn duy nhất, thì điều này không áp dụng cho tính hợp lệ của chính bộ quy tắc đó

Điều này dẫn đến một hệ quả quan trọng. nếu một bộ chọn cơ bản duy nhất không hợp lệ, chẳng hạn như khi sử dụng một phần tử giả hoặc lớp giả không xác định, thì toàn bộ bộ chọn không hợp lệ và do đó, toàn bộ quy tắc sẽ bị bỏ qua (cũng không hợp lệ)

câu lệnh CSS

Bộ quy tắc là các khối xây dựng chính của biểu định kiểu, thường chỉ bao gồm một danh sách lớn các quy tắc đó. Nhưng có những thông tin khác mà tác giả Web muốn truyền đạt trong biểu định kiểu, chẳng hạn như bộ ký tự, các biểu định kiểu bên ngoài khác để nhập, mặt phông chữ hoặc mô tả bộ đếm danh sách, v.v. Nó sẽ sử dụng các loại câu lệnh cụ thể và khác để làm điều đó

Câu lệnh là một khối xây dựng bắt đầu bằng bất kỳ ký tự không phải dấu cách nào và kết thúc bằng dấu ngoặc nhọn hoặc dấu chấm phẩy đầu tiên (bên ngoài chuỗi, không thoát và không được đưa vào cặp {}, () hoặc [] khác)

Có hai loại tuyên bố

• Bộ quy tắc (hoặc quy tắc), như đã thấy, liên kết một tập hợp các khai báo CSS với một điều kiện được mô tả bởi bộ chọn
• Các quy tắc tại bắt đầu bằng ký hiệu tại, 'h1 { color: blue; margin-top: 1em; }
p { padding: 5px; }
td { background-color: #ddd; }4' (U+003A COLON0), theo sau là một mã định danh và sau đó tiếp tục cho đến cuối câu lệnh, cho đến dấu chấm phẩy (;) tiếp theo bên ngoài khối hoặc dấu chấm hết . Mỗi loại quy tắc tại, được xác định bởi mã định danh, có thể có cú pháp bên trong và ngữ nghĩa của riêng nó. Chúng được sử dụng để truyền đạt thông tin siêu dữ liệu (như U+003A COLON1 hoặc U+003A COLON2), thông tin có điều kiện (như U+003A COLON3 hoặc U+003A COLON4) hoặc thông tin mô tả (như U+003A COLON5)

Bất kỳ câu lệnh nào không phải là bộ quy tắc hoặc quy tắc tại đều không hợp lệ và bị bỏ qua

câu lệnh lồng nhau

Có một nhóm câu lệnh khác – câu lệnh lồng nhau. Đây là những câu lệnh có thể được sử dụng trong một tập con cụ thể của các quy tắc tại – quy tắc nhóm có điều kiện. Những tuyên bố này chỉ áp dụng nếu một điều kiện cụ thể được đáp ứng. nội dung theo quy tắc U+003A COLON3 chỉ được áp dụng nếu thiết bị chạy trình duyệt phù hợp với điều kiện đã nêu; . Trong CSS1 và CSS2. 1, chỉ có thể sử dụng bộ quy tắc bên trong quy tắc nhóm có điều kiện. Điều đó rất hạn chế và hạn chế này đã được gỡ bỏ trong Điều kiện CSS cấp 3. Hiện tại, mặc dù vẫn còn đang thử nghiệm và không được mọi trình duyệt hỗ trợ, các quy tắc nhóm có điều kiện có thể chứa nhiều nội dung hơn. bộ quy tắc nhưng cũng có một số, nhưng không phải tất cả, quy tắc

3 phần của bộ quy tắc CSS là gì?

Bộ quy tắc CSS là gì?

2 thành phần chính của bộ quy tắc CSS là gì?

Có bao nhiêu bộ quy tắc trong CSS?