Bộ chọn số CSS

Phần này mô tả ngữ pháp (và các quy tắc phân tích cú pháp tương thích chuyển tiếp) chung cho mọi cấp độ CSS (bao gồm cả CSS 2. 1). Các bản cập nhật CSS trong tương lai sẽ tuân thủ cú pháp cốt lõi này, mặc dù chúng có thể thêm các ràng buộc cú pháp bổ sung

Những mô tả này là tiêu chuẩn. Chúng cũng được bổ sung bởi các quy tắc ngữ pháp chuẩn mực được trình bày trong Phụ lục G

Trong đặc điểm kỹ thuật này, các cụm từ "ngay trước" hoặc "ngay sau" có nghĩa là không có khoảng trắng xen vào hoặc nhận xét

Tất cả các cấp CSS — cấp 1, cấp 2 và bất kỳ cấp nào trong tương lai — sử dụng cùng một cú pháp cốt lõi. Điều này cho phép các UA phân tích các biểu định kiểu (mặc dù không hiểu hoàn toàn) được viết ở các mức CSS không tồn tại tại thời điểm các UA được tạo. Nhà thiết kế có thể sử dụng tính năng này để tạo các biểu định kiểu hoạt động với các tác nhân người dùng cũ hơn, đồng thời thực hiện các khả năng của các cấp CSS mới nhất

Ở cấp độ từ vựng, biểu định kiểu CSS bao gồm một chuỗi các mã thông báo. Danh sách các mã thông báo cho CSS như sau. Các định nghĩa sử dụng biểu thức chính quy kiểu Lex. Mã bát phân tham khảo ISO 10646 (). Như trong Lex, trong trường hợp có nhiều trận đấu, trận đấu dài nhất sẽ xác định mã thông báo

TokenDefinitionIDENT
-moz-box-sizing
-moz-border-radius
-wap-accesskey
0ATKEYWORD
-moz-box-sizing
-moz-border-radius
-wap-accesskey
1STRING
-moz-box-sizing
-moz-border-radius
-wap-accesskey
2BAD_STRING
-moz-box-sizing
-moz-border-radius
-wap-accesskey
3BAD_URI
-moz-box-sizing
-moz-border-radius
-wap-accesskey
4BAD_COMMENT
-moz-box-sizing
-moz-border-radius
-wap-accesskey
5HASH
-moz-box-sizing
-moz-border-radius
-wap-accesskey
6NUMBER
-moz-box-sizing
-moz-border-radius
-wap-accesskey
7PERCENTAGE
-moz-box-sizing
-moz-border-radius
-wap-accesskey
8DIMENSION
-moz-box-sizing
-moz-border-radius
-wap-accesskey
9URI

@import "subs.css";
h1 { color: blue }
@import "list.css";
0UNICODE-RANGE

@import "subs.css";
h1 { color: blue }
@import "list.css";
1CDO.

@import "subs.css";
h1 { color: blue }
@import "list.css";
2;

@import "subs.css";
h1 { color: blue }
@import "list.css";
3{

@import "subs.css";
h1 { color: blue }
@import "list.css";
4}

@import "subs.css";
h1 { color: blue }
@import "list.css";
5(

@import "subs.css";
h1 { color: blue }
@import "list.css";
6)

@import "subs.css";
h1 { color: blue }
@import "list.css";
7[

@import "subs.css";
h1 { color: blue }
@import "list.css";
8]

@import "subs.css";
h1 { color: blue }
@import "list.css";
9S

@import "subs.css";
h1 { color: blue }
0BÌNH LUẬN

@import "subs.css";
h1 { color: blue }
1CHỨC NĂNG_______20_______2BAO GỒM

@import "subs.css";
h1 { color: blue }
3DASHMATCH_______20_______4DELINhiều ký tự khác không khớp với một hoặc hai ký tự ở trên và trích dẫn

Các macro trong dấu ngoặc nhọn ({}) ở trên được định nghĩa như sau

MacroDefinitionident

@import "subs.css";
h1 { color: blue }
5name

@import "subs.css";
h1 { color: blue }
6nmstart

@import "subs.css";
h1 { color: blue }
7nonascii

@import "subs.css";
h1 { color: blue }
8unicode

@import "subs.css";
h1 { color: blue }
9escape

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
0nmchar

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
1num

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
2string

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
3string1

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
4string2

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
5badstring

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
6badstring1

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
7badstring2

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
8badcomment

@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }
9badcomment1

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
0badcomment2

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
1baduri

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
2baduri1

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
3baduri2

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
4baduri3

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
5nl

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
6w

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
7

(các) ví dụ

Ví dụ: quy tắc của trận đấu dài nhất có nghĩa là "


@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
8" được mã hóa thành IDENT "

@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }
9" theo sau là DELIM "_______50_______00", thay vì dưới dạng IDENT theo sau là CDC

Dưới đây là cú pháp cốt lõi cho CSS. Các phần tiếp theo mô tả cách sử dụng nó. Phụ lục G mô tả ngữ pháp hạn chế hơn, gần với ngôn ngữ CSS cấp 2 hơn. Các phần của biểu định kiểu có thể được phân tích cú pháp theo ngữ pháp này nhưng không theo ngữ pháp trong Phụ lục G nằm trong số các phần sẽ bị bỏ qua theo

stylesheet  : [ CDO | CDC | S | statement ]*;
statement   : ruleset | at-rule;
at-rule     : ATKEYWORD S* any* [ block | ';' S* ];
block       : '{' S* [ any | block | ATKEYWORD S* | ';' S* ]* '}' S*;
ruleset     : selector? '{' S* declaration? [ ';' S* declaration? ]* '}' S*;
selector    : any+;
declaration : property S* ':' S* value;
property    : IDENT;
value       : [ any | block | ATKEYWORD S* ]+;
any         : [ IDENT | NUMBER | PERCENTAGE | DIMENSION | STRING
              | DELIM | URI | HASH | UNICODE-RANGE | INCLUDES
              | DASHMATCH | ':' | FUNCTION S* [any|unused]* ')'
              | '(' S* [any|unused]* ')' | '[' S* [any|unused]* ']'
              ] S*;
unused      : block | ATKEYWORD S* | ';' S* | CDO S* | CDC S*;

Sản xuất "không sử dụng" không được sử dụng trong CSS và sẽ không được sử dụng bởi bất kỳ tiện ích mở rộng nào trong tương lai. Nó được bao gồm ở đây chỉ để giúp xử lý lỗi. (Nhìn thấy )

Mã thông báo NHẬN XÉT không xuất hiện trong ngữ pháp (để giữ cho nó có thể đọc được), nhưng bất kỳ số lượng mã thông báo nào trong số này có thể xuất hiện ở bất kỳ đâu bên ngoài các mã thông báo khác. (Tuy nhiên, lưu ý rằng một nhận xét trước hoặc trong quy tắc @charset sẽ vô hiệu hóa @charset. )

Mã thông báo S trong ngữ pháp trên là viết tắt của khoảng trắng. Chỉ các ký tự "dấu cách" (U+0020), "tab" (U+0009), "nạp dòng" (U+000A), "xuống dòng" (U+000D) và "nạp biểu mẫu" (U+000C . Các ký tự giống như khoảng trắng khác, chẳng hạn như "em-space" (U+2003) và "dấu cách chữ tượng hình" (U+3000), không bao giờ là một phần của khoảng trắng

Ý nghĩa của thông tin đầu vào không thể mã hóa hoặc phân tích cú pháp không được xác định trong CSS 2. 1

Từ khóa có dạng Từ khóa không được đặt giữa dấu ngoặc kép (". " hoặc '. '). Như vậy,

red

là một từ khóa, nhưng

"red"

không phải. (Nó là một. ) Các ví dụ bất hợp pháp khác

ví dụ bất hợp pháp)


width: "auto";
border: "none";
background: "red";

4. 1. 2. 1 Tiện ích mở rộng dành riêng cho nhà cung cấp

Trong CSS, số nhận dạng có thể bắt đầu bằng '_______50_______01' (dấu gạch ngang) hoặc '

red
02' (dấu gạch dưới). Các từ khóa và bắt đầu bằng
red
01' hoặc '
red
02' được dành riêng cho các tiện ích mở rộng dành riêng cho nhà cung cấp. Các tiện ích mở rộng dành riêng cho nhà cung cấp đó phải có một trong các định dạng sau

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name

(các) ví dụ

Ví dụ: nếu tổ chức XYZ đã thêm thuộc tính để mô tả màu của đường viền ở phía Đông của màn hình, họ có thể gọi thuộc tính đó là -xyz-border-east-color

Các ví dụ đã biết khác

-moz-box-sizing
-moz-border-radius
-wap-accesskey

Dấu gạch ngang hoặc dấu gạch dưới ban đầu được đảm bảo không bao giờ được sử dụng trong thuộc tính hoặc từ khóa bởi bất kỳ cấp độ CSS hiện tại hoặc tương lai nào. Do đó, việc triển khai CSS điển hình có thể không nhận ra các thuộc tính đó và có thể bỏ qua chúng theo. Tuy nhiên, vì dấu gạch ngang đầu tiên hoặc dấu gạch dưới là một phần của ngữ pháp nên CSS 2. 1 người triển khai phải luôn có thể sử dụng trình phân tích cú pháp tuân thủ CSS, cho dù họ có hỗ trợ bất kỳ tiện ích mở rộng dành riêng cho nhà cung cấp nào hay không

Tác giả nên tránh các tiện ích mở rộng dành riêng cho nhà cung cấp

4. 1. 2. 2 Ghi chú Lịch sử Thông tin

Phần này là thông tin

Tại thời điểm viết, các tiền tố sau được biết là tồn tại

prefixorganization
red
05,
red
06Microsoft
red
07Mozilla
red
08,
red
09Opera Software
red
10Advanced Television Standards Committee
red
11The WAP Forum
red
12KDE
red
13Apple
red
14YesLogic
red
15Antenna House
red
16Hewlett Packard
red
17Real Objects
red
18Research In Motion
red
19TallComponents

Các quy tắc sau đây luôn giữ

  • Tất cả cú pháp CSS không phân biệt chữ hoa chữ thường trong phạm vi ASCII (i. e. , [a-z] và [A-Z] là tương đương), trừ những phần không chịu sự kiểm soát của CSS. Ví dụ: phân biệt chữ hoa chữ thường của các giá trị thuộc tính HTML "id" và "class", tên phông chữ và URI nằm ngoài phạm vi của thông số kỹ thuật này. Đặc biệt lưu ý rằng tên phần tử không phân biệt chữ hoa chữ thường trong HTML, nhưng phân biệt chữ hoa chữ thường trong XML
  • Trong CSS, mã định danh (bao gồm tên thành phần, lớp và ID trong bộ chọn) chỉ có thể chứa ký tự [a-zA-Z0-9] và ký tự ISO 10646 U+00A0 trở lên, cùng với dấu gạch nối (-) và dấu gạch dưới ( . Số nhận dạng cũng có thể chứa các ký tự thoát và bất kỳ ký tự ISO 10646 nào dưới dạng mã số (xem mục tiếp theo). Chẳng hạn, mã định danh "B&W?"

    Lưu ý rằng Unicode là mã theo mã tương đương với ISO 10646 (xem và )

  • Trong CSS 2. 1, ký tự gạch chéo ngược (\) có thể biểu thị một trong ba loại ký tự thoát. Bên trong một chú thích CSS, một dấu gạch chéo ngược đại diện cho chính nó, và nếu một dấu gạch chéo ngược được đặt ngay sau phần cuối của biểu định kiểu, thì nó cũng đại diện cho chính nó (i. e. , mã thông báo DELIM)

    Đầu tiên, bên trong a , dấu gạch chéo ngược theo sau bởi một dòng mới sẽ bị bỏ qua (i. e. , chuỗi được coi là không chứa dấu gạch chéo ngược hoặc xuống dòng). Bên ngoài một chuỗi, dấu gạch chéo ngược theo sau bởi một dòng mới là viết tắt của chính nó (i. e. , một DELIM theo sau bởi một dòng mới)

    Thứ hai, nó hủy bỏ ý nghĩa của các ký tự CSS đặc biệt. Bất kỳ ký tự nào (ngoại trừ chữ số thập lục phân, nguồn cấp dữ liệu, xuống dòng hoặc nguồn cấp biểu mẫu) đều có thể được thoát bằng dấu gạch chéo ngược để loại bỏ ý nghĩa đặc biệt của nó. Ví dụ: "\"" là một chuỗi bao gồm một dấu ngoặc kép. Bộ tiền xử lý biểu định kiểu không được xóa các dấu gạch chéo ngược này khỏi biểu định kiểu vì điều đó sẽ thay đổi ý nghĩa của biểu định kiểu

    Thứ ba, thoát dấu gạch chéo ngược cho phép tác giả đề cập đến các ký tự mà họ không thể dễ dàng đưa vào tài liệu. Trong trường hợp này, dấu gạch chéo ngược được theo sau bởi tối đa sáu chữ số thập lục phân (0. 9A. F), viết tắt của ký tự ISO 10646 () với số đó, không được bằng 0. (Không xác định được trong CSS 2. 1 điều gì sẽ xảy ra nếu biểu định kiểu chứa một ký tự có điểm mã Unicode bằng 0. ) Nếu một ký tự trong phạm vi [0-9a-fA-F] theo sau số thập lục phân, phần cuối của số cần được làm rõ. Có hai cách để làm điều đó

    1. với một khoảng trắng (hoặc ký tự khoảng trắng khác). "\26 B" ("&B"). Trong trường hợp này, tác nhân người dùng nên coi cặp "CR/LF" (U+000D/U+000A) là một ký tự khoảng trắng
    2. bằng cách cung cấp chính xác 6 chữ số thập lục phân. "\000026B" ("&B")

    Trong thực tế, hai phương pháp này có thể được kết hợp. Chỉ một ký tự khoảng trắng bị bỏ qua sau khi thoát hệ thập lục phân. Lưu ý rằng điều này có nghĩa là khoảng trắng "thực" sau chuỗi thoát phải được nhân đôi

    Nếu số nằm ngoài phạm vi cho phép của Unicode (e. g. , "\110000" cao hơn mức tối đa 10FFFF được phép trong Unicode hiện tại), UA có thể thay thế lối thoát bằng "ký tự thay thế" (U+FFFD). Nếu ký tự được hiển thị, UA sẽ hiển thị biểu tượng có thể nhìn thấy, chẳng hạn như hình tượng "ký tự bị thiếu" (cf. điểm 5)

  • Ghi chú. Thoát dấu gạch chéo ngược luôn được coi là một phần của một hoặc một chuỗi (i. e. , "\7B" không phải là dấu chấm câu, mặc dù "{" là dấu chấm câu và "\32" được cho phép ở đầu tên lớp, mặc dù "2" không phải là dấu chấm câu)

    Mã định danh "te\st" hoàn toàn giống với mã định danh "test"

Một biểu định kiểu CSS, đối với mọi cấp độ CSS, bao gồm một danh sách các câu lệnh (xem phần trên). Có hai loại tuyên bố. quy tắc tại và bộ quy tắc. Có thể có xung quanh các tuyên bố

Quy tắc tại bắt đầu bằng từ khóa tại, ký tự '@' ngay sau đó là ký tự (ví dụ: '@import', '@page')

Một quy tắc bao gồm mọi thứ cho đến và bao gồm cả dấu chấm phẩy tiếp theo (;) hoặc tiếp theo tùy điều kiện nào đến trước

CSS 2. 1 tác nhân người dùng phải có bất kỳ quy tắc nào xảy ra bên trong hoặc sau bất kỳ câu lệnh không bị bỏ qua nào ngoài quy tắc @charset hoặc @import

ví dụ bất hợp pháp)

Ví dụ: giả sử rằng CSS 2. 1 trình phân tích cú pháp bắt gặp biểu định kiểu này


@import "subs.css";
h1 { color: blue }
@import "list.css";

'@import' thứ hai là bất hợp pháp theo CSS 2. 1. CSS 2. 1 toàn bộ quy tắc, giảm hiệu quả biểu định kiểu thành


@import "subs.css";
h1 { color: blue }

ví dụ bất hợp pháp)

Trong ví dụ sau, quy tắc '@import' thứ hai không hợp lệ vì nó xảy ra bên trong '@media'


@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }

Thay vào đó, để đạt được hiệu quả của việc chỉ nhập biểu định kiểu cho phương tiện 'in', hãy sử dụng quy tắc @import với cú pháp phương tiện, e. g


@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }

Một khối bắt đầu bằng dấu ngoặc nhọn trái ({) và kết thúc bằng dấu ngoặc nhọn phải phù hợp (}). Ở giữa có thể có bất kỳ mã thông báo nào, ngoại trừ dấu ngoặc đơn (( )), dấu ngoặc vuông ([ ]) và dấu ngoặc nhọn ({ }) phải luôn xuất hiện theo cặp giống nhau và có thể được lồng vào nhau. Dấu ngoặc đơn (') và dấu ngoặc kép (") cũng phải xuất hiện trong các cặp phù hợp và các ký tự giữa chúng được phân tích cú pháp dưới dạng chuỗi. Xem ở trên để biết định nghĩa của một chuỗi

ví dụ bất hợp pháp)

Đây là một ví dụ về một khối. Lưu ý rằng dấu ngoặc nhọn bên phải giữa các dấu ngoặc kép không khớp với dấu ngoặc đơn mở của khối và dấu ngoặc đơn thứ hai là một và do đó không khớp với dấu ngoặc đơn đầu tiên

red
0

Xin lưu ý rằng quy tắc trên không phải là CSS hợp lệ 2. 1, nhưng nó vẫn là một khối như đã định nghĩa ở trên

Một bộ quy tắc (còn được gọi là "quy tắc") bao gồm một bộ chọn theo sau là một khối khai báo

Một khối khai báo bắt đầu bằng dấu ngoặc nhọn trái ({) và kết thúc bằng dấu ngoặc nhọn phải phù hợp (}). Ở giữa phải có một danh sách gồm 0 hoặc nhiều khai báo được phân tách bằng dấu chấm phẩy (;)

Bộ chọn (xem thêm phần về bộ chọn) bao gồm mọi thứ cho đến (nhưng không bao gồm) dấu ngoặc nhọn bên trái đầu tiên ({). Bộ chọn luôn đi cùng với khối khai báo. Khi tác nhân người dùng không thể phân tích cú pháp bộ chọn (i. e. , đó không phải là CSS hợp lệ 2. 1), nó cũng phải là bộ chọn và khối khai báo sau (nếu có)

CSS 2. 1 mang ý nghĩa đặc biệt cho dấu phẩy (,) trong bộ chọn. Tuy nhiên, vì không biết liệu dấu phẩy có thể mang ý nghĩa khác trong các bản cập nhật CSS trong tương lai hay không, nên toàn bộ câu lệnh sẽ là nếu có lỗi ở bất kỳ đâu trong bộ chọn, mặc dù phần còn lại của bộ chọn có vẻ hợp lý trong CSS 2. 1

ví dụ bất hợp pháp)

Ví dụ: vì "&" không phải là mã thông báo hợp lệ trong CSS 2. 1 bộ chọn, CSS 2. 1 tác nhân người dùng phải toàn bộ dòng thứ hai và không đặt màu của H3 thành màu đỏ

red
1

(các) ví dụ

Đây là một ví dụ phức tạp hơn. Hai cặp dấu ngoặc nhọn đầu tiên nằm bên trong một chuỗi và không đánh dấu phần cuối của bộ chọn. Đây là một CSS hợp lệ 2. 1 quy tắc

red
2

Một khai báo trống hoặc bao gồm một tên thuộc tính, theo sau là dấu hai chấm (. ), theo sau là giá trị thuộc tính. Xung quanh mỗi trong số này có thể có

Do cách thức hoạt động của bộ chọn, nhiều khai báo cho cùng một bộ chọn có thể được tổ chức thành các nhóm được phân tách bằng dấu chấm phẩy (;)

(các) ví dụ

Vì vậy, các quy tắc sau

red
3

tương đương với

red
4

Tên thuộc tính là một. Bất kỳ mã thông báo nào có thể xảy ra trong giá trị thuộc tính. Dấu ngoặc đơn ("( )"), dấu ngoặc nhọn ("[ ]"), dấu ngoặc nhọn ("{ }"), dấu ngoặc đơn (') và dấu ngoặc kép (") phải đi theo cặp giống nhau và dấu chấm phẩy không có trong chuỗi phải là. Dấu ngoặc đơn, dấu ngoặc đơn và dấu ngoặc nhọn có thể được lồng vào nhau. Bên trong dấu ngoặc kép, các ký tự được phân tích dưới dạng chuỗi

Cú pháp của các giá trị được chỉ định riêng cho từng thuộc tính, nhưng trong mọi trường hợp, các giá trị được tạo từ mã định danh, chuỗi, số, độ dài, tỷ lệ phần trăm, URI, màu sắc, v.v.

Tác nhân người dùng phải khai báo có tên thuộc tính không hợp lệ hoặc giá trị không hợp lệ. Mỗi thuộc tính CSS có các hạn chế về cú pháp và ngữ nghĩa riêng đối với các giá trị mà nó chấp nhận

ví dụ bất hợp pháp)

Ví dụ: giả sử một CSS 2. 1 trình phân tích cú pháp bắt gặp biểu định kiểu này

red
5

Khai báo thứ hai trên dòng đầu tiên có giá trị không hợp lệ '12pt'. Khai báo thứ hai trên dòng thứ hai chứa một thuộc tính không xác định 'font-vendor'. CSS 2. 1 trình phân tích cú pháp sẽ thực hiện các khai báo này, giảm hiệu quả biểu định kiểu thành

red
6

Chú thích bắt đầu bằng ký tự "/*" và kết thúc bằng ký tự "*/". Chúng có thể xuất hiện ở bất kỳ đâu bên ngoài các mã thông báo khác và nội dung của chúng không ảnh hưởng đến kết xuất. Nhận xét có thể không được lồng nhau

CSS cũng cho phép các dấu phân cách nhận xét SGML ("") ở một số vị trí nhất định được xác định bởi ngữ pháp, nhưng chúng không phân định các nhận xét CSS. Chúng được phép để các quy tắc kiểu dáng xuất hiện trong tài liệu nguồn HTML (trong phần tử STYLE) có thể bị ẩn khỏi tiền HTML 3. 2 tác nhân người dùng. Xem đặc tả HTML 4 () để biết thêm thông tin

Trong một số trường hợp, tác nhân người dùng phải bỏ qua một phần của biểu định kiểu không hợp lệ. Thông số kỹ thuật này định nghĩa bỏ qua có nghĩa là tác nhân người dùng phân tích cú pháp phần không hợp lệ (để tìm điểm bắt đầu và kết thúc của nó), nhưng nếu không thì hành động như thể nó không có ở đó. CSS 2. 1 dự trữ cho các bản cập nhật trong tương lai của CSS tất cả thuộc tính. kết hợp giá trị và từ khóa @ không chứa mã định danh bắt đầu bằng dấu gạch ngang hoặc dấu gạch dưới. Việc triển khai phải bỏ qua các kết hợp như vậy (ngoài những kết hợp được giới thiệu bởi các bản cập nhật CSS trong tương lai)

Để đảm bảo rằng các thuộc tính mới và giá trị mới cho các thuộc tính hiện có có thể được thêm vào trong tương lai, tác nhân người dùng bắt buộc phải tuân theo các quy tắc sau khi họ gặp phải các tình huống sau

  • thuộc tính không xác định. Tác nhân người dùng phải có thuộc tính không xác định. Ví dụ: nếu biểu định kiểu là.
    red
    
    7

    tác nhân người dùng sẽ coi điều này như thể biểu định kiểu đã được

    red
    
    8
  • giá trị bất hợp pháp. Tác nhân người dùng phải bỏ qua một khai báo có giá trị không hợp lệ. Ví dụ.
    red
    
    9A CSS 2. 1 trình phân tích cú pháp sẽ tôn trọng quy tắc đầu tiên và phần còn lại, như thể biểu định kiểu đã được.
    "red"
    
    0

    Tác nhân người dùng tuân theo đặc tả CSS trong tương lai cũng có thể chấp nhận một hoặc nhiều quy tắc khác

  • khai báo không đúng định dạng. Tác nhân người dùng phải xử lý các mã thông báo không mong muốn gặp phải trong khi phân tích cú pháp khai báo bằng cách đọc cho đến khi kết thúc khai báo, đồng thời tuân thủ các quy tắc đối sánh các cặp (), [], {}, "", và '' và xử lý chính xác các lần thoát. Ví dụ: khai báo không đúng định dạng có thể thiếu tên thuộc tính, dấu hai chấm (. ), hoặc giá trị tài sản. Sau đây là tất cả tương đương.
    "red"
    
    1
  • Tuyên bố không đúng định dạng. Tác nhân người dùng phải xử lý các mã thông báo không mong muốn gặp phải trong khi phân tích cú pháp câu lệnh bằng cách đọc cho đến hết câu lệnh, đồng thời tuân thủ các quy tắc đối sánh các cặp (), [], {}, "", và '', đồng thời xử lý chính xác các lần thoát. Ví dụ: một câu lệnh không đúng định dạng có thể chứa dấu ngoặc đóng hoặc từ khóa at không mong muốn. e. g. , các dòng sau đều bị bỏ qua.
    "red"
    
    2
  • Quy tắc tại với từ khóa tại không xác định. Tác nhân người dùng phải có từ khóa at không hợp lệ cùng với mọi thứ theo sau nó, cho đến hết khối chứa từ khóa at không hợp lệ hoặc tối đa và bao gồm dấu chấm phẩy tiếp theo (;) hoặc tối đa và bao gồm khối tiếp theo ( . }), bất cứ thứ gì đến trước. Ví dụ, hãy xem xét những điều sau đây.
    "red"
    
    3

    Quy tắc '@three-dee' không phải là một phần của CSS 2. 1. Do đó, toàn bộ quy tắc tại (tối đa và bao gồm cả dấu ngoặc nhọn thứ ba bên phải) là CSS 2. 1 tác nhân người dùng nó, giảm hiệu quả biểu định kiểu thành

    "red"
    
    4

    Nội dung nào đó bên trong quy tắc tại chỗ bị bỏ qua vì không hợp lệ, chẳng hạn như khai báo không hợp lệ trong @quy tắc phương tiện, không làm cho toàn bộ quy tắc tại đó không hợp lệ

  • Kết thúc bất ngờ của biểu định kiểu

    Tác nhân người dùng phải đóng tất cả các cấu trúc đang mở (ví dụ:. khối, dấu ngoặc đơn, dấu ngoặc vuông, quy tắc, chuỗi và nhận xét) ở cuối biểu định kiểu. Ví dụ

    "red"
    
    5

    sẽ được đối xử giống như

    "red"
    
    6

    trong một UA phù hợp

  • Kết thúc chuỗi không mong muốn

    Tác nhân người dùng phải đóng chuỗi khi đến cuối dòng (i. e. , trước một nguồn cấp dữ liệu không thoát, ký tự xuống dòng hoặc ký tự nguồn cấp biểu mẫu), nhưng sau đó bỏ cấu trúc (khai báo hoặc quy tắc) trong đó chuỗi được tìm thấy. Ví dụ

    "red"
    
    7

    sẽ được đối xử giống như

    "red"
    
    8

    bởi vì khai báo thứ hai (từ 'họ phông chữ' đến dấu chấm phẩy sau 'màu. red') không hợp lệ và bị loại bỏ

  • Xem thêm quy tắc phân tích cú pháp cho các khối khai báo

Một số loại giá trị có thể có giá trị số nguyên (ký hiệu là ) hoặc giá trị số thực (ký hiệu là ). Số thực và số nguyên chỉ được chỉ định trong ký hiệu thập phân. Bao gồm một hoặc nhiều chữ số "0" đến "9". Có thể là một hoặc có thể là 0 hoặc nhiều chữ số theo sau là dấu chấm (. ) theo sau bởi một hoặc nhiều chữ số. Cả số nguyên và số thực đều có thể đặt trước dấu "-" hoặc "+" để chỉ dấu. -0 tương đương với 0 và không phải là số âm

Lưu ý rằng nhiều thuộc tính cho phép một số nguyên hoặc số thực làm giá trị thực sự hạn chế giá trị ở một số phạm vi, thường là giá trị không âm

Độ dài đề cập đến các phép đo khoảng cách

Định dạng của giá trị độ dài (được biểu thị trong thông số kỹ thuật này) là (có hoặc không có dấu thập phân) ngay sau đó là mã định danh đơn vị (e. g. , px, em, v.v. ). Sau độ dài bằng 0, mã định danh đơn vị là tùy chọn

Một số thuộc tính cho phép giá trị độ dài âm, nhưng điều này có thể làm phức tạp mô hình định dạng và có thể có các giới hạn triển khai cụ thể. Nếu không thể hỗ trợ giá trị độ dài âm, giá trị đó phải được chuyển đổi thành giá trị gần nhất có thể được hỗ trợ

Nếu giá trị độ dài âm được đặt trên một thuộc tính không cho phép giá trị độ dài âm, khai báo sẽ bị bỏ qua

Trong trường hợp không thể hỗ trợ độ dài, tác nhân người dùng phải tính gần đúng độ dài đó trong

Có hai loại đơn vị độ dài. tương đối và tuyệt đối. Đơn vị độ dài tương đối chỉ định độ dài so với thuộc tính độ dài khác. Các biểu định kiểu sử dụng các đơn vị tương đối có thể dễ dàng thay đổi quy mô từ môi trường đầu ra này sang môi trường đầu ra khác

đơn vị tương đối là

  • em. phông chữ có liên quan
  • bán tại. 'chiều cao x' của phông chữ có liên quan

(các) ví dụ

"red"
9

Đơn vị 'em' bằng với giá trị tính toán của thuộc tính của phần tử mà nó được sử dụng. Ngoại lệ là khi 'em' xuất hiện trong giá trị của chính thuộc tính 'cỡ chữ', trong trường hợp đó, nó đề cập đến kích thước phông chữ của phần tử gốc. Nó có thể được sử dụng để đo dọc hoặc ngang. (Đơn vị này đôi khi còn được gọi là bốn chiều rộng trong các văn bản chính tả. )

Đơn vị 'ex' được xác định bởi phông chữ có sẵn đầu tiên của phần tử. Ngoại lệ là khi 'ex' xuất hiện trong giá trị của thuộc tính, trong trường hợp đó, nó đề cập đến 'ex' của phần tử gốc

'Chiều cao x' được gọi như vậy vì nó thường bằng chiều cao của chữ thường "x". Tuy nhiên, 'ex' được xác định ngay cả đối với các phông chữ không chứa "x"

Chiều cao x của phông chữ có thể được tìm thấy theo nhiều cách khác nhau. Một số phông chữ chứa số liệu đáng tin cậy cho chiều cao x. Nếu không có số liệu phông chữ đáng tin cậy, UAs có thể xác định chiều cao x từ chiều cao của glyph chữ thường. Một phương pháp phỏng đoán khả thi là xem xét glyph cho chữ thường "o" kéo dài bên dưới đường cơ sở bao xa và trừ giá trị đó khỏi đầu hộp giới hạn của nó. Trong trường hợp không thể hoặc không thực tế để xác định chiều cao x, giá trị bằng 0. 5em nên được sử dụng

(các) ví dụ

quy tắc


width: "auto";
border: "none";
background: "red";
0

có nghĩa là chiều cao dòng của phần tử "h1" sẽ lớn hơn 20% so với kích thước phông chữ của phần tử "h1". Mặt khác


width: "auto";
border: "none";
background: "red";
1

có nghĩa là kích thước phông chữ của các phần tử "h1" sẽ lớn hơn 20% so với kích thước phông chữ được kế thừa bởi các phần tử "h1"

Khi được chỉ định cho thư mục gốc của (e. g. , "HTML" trong HTML), 'em' và 'ex' đề cập đến thuộc tính của

Các phần tử con không kế thừa các giá trị tương đối được chỉ định cho phần tử cha của chúng;

(các) ví dụ

Theo các quy tắc sau, giá trị được tính toán của phần tử "h1" sẽ là 36px, không phải 45px, nếu "h1" là phần tử con của phần tử "body"


width: "auto";
border: "none";
background: "red";
2

Đơn vị độ dài tuyệt đối được cố định trong mối quan hệ với nhau. Chúng chủ yếu hữu ích khi môi trường đầu ra được biết đến. Các đơn vị tuyệt đối bao gồm các đơn vị vật lý (in, cm, mm, pt, pc) và đơn vị px

  • TRONG. inch - 1in bằng 2. 54cm
  • cm. centimet
  • mm. mi-li-mét
  • điểm. điểm — số điểm mà CSS sử dụng bằng 1/72 của 1in
  • máy tính. picas - 1pc bằng 12pt
  • px. đơn vị pixel - 1px bằng 0. 75 điểm

Đối với thiết bị CSS, các kích thước này được cố định (i) bằng cách liên kết các đơn vị vật lý với các phép đo vật lý của chúng hoặc (ii) bằng cách liên kết đơn vị pixel với pixel tham chiếu. Đối với phương tiện in và các thiết bị có độ phân giải cao tương tự, đơn vị neo phải là một trong các đơn vị vật lý tiêu chuẩn (inch, centimet, v.v.). Đối với các thiết bị có độ phân giải thấp hơn và các thiết bị có khoảng cách xem bất thường, thay vào đó, đơn vị neo nên là đơn vị pixel. Đối với những thiết bị như vậy, đơn vị pixel đề cập đến toàn bộ số lượng pixel của thiết bị gần đúng nhất với pixel tham chiếu

Lưu ý rằng nếu đơn vị neo là đơn vị pixel, các đơn vị vật lý có thể không khớp với các phép đo vật lý của chúng. Ngoài ra, nếu đơn vị neo là đơn vị vật lý, thì đơn vị pixel có thể không ánh xạ tới toàn bộ số pixel thiết bị

Lưu ý rằng định nghĩa đơn vị pixel và đơn vị vật lý này khác với các phiên bản CSS trước đó. Đặc biệt, trong các phiên bản trước của CSS, đơn vị pixel và đơn vị vật lý không liên quan với nhau theo một tỷ lệ cố định. các đơn vị vật lý luôn được gắn với các phép đo vật lý của chúng trong khi đơn vị pixel sẽ thay đổi để khớp gần nhất với pixel tham chiếu. (Thay đổi này được thực hiện vì có quá nhiều nội dung hiện có dựa trên giả định 96dpi và việc phá vỡ giả định đó sẽ phá vỡ nội dung. )

Pixel tham chiếu là góc nhìn của một pixel trên thiết bị có mật độ pixel là 96dpi và cách đầu đọc một sải tay. Đối với chiều dài danh nghĩa của cánh tay là 28 inch, do đó, góc nhìn là khoảng 0. 0213 độ. Để đọc ở độ dài của cánh tay, do đó, 1px tương ứng với khoảng 0. 26 mm (1/96 inch)

Hình ảnh bên dưới minh họa ảnh hưởng của khoảng cách xem đối với kích thước của pixel tham chiếu. khoảng cách đọc là 71 cm (28 inch) dẫn đến pixel tham chiếu là 0. 26 mm, trong khi khoảng cách đọc là 3. 5 m (12 feet) dẫn đến pixel tham chiếu là 1. 3 mm

Hình ảnh thứ hai này minh họa ảnh hưởng của độ phân giải của thiết bị đối với đơn vị pixel. diện tích 1px x 1px được bao phủ bởi một dấu chấm trong thiết bị có độ phân giải thấp (e. g. màn hình máy tính điển hình), trong khi cùng một khu vực được bao phủ bởi 16 chấm trong thiết bị có độ phân giải cao hơn (chẳng hạn như máy in)

(các) ví dụ


width: "auto";
border: "none";
background: "red";
3

Định dạng của một giá trị phần trăm (được biểu thị bằng trong thông số kỹ thuật này) ngay sau đó là '%'

Giá trị phần trăm luôn liên quan đến giá trị khác, ví dụ: độ dài. Mỗi thuộc tính cho phép tỷ lệ phần trăm cũng xác định giá trị mà tỷ lệ phần trăm đề cập đến. Giá trị có thể là giá trị của thuộc tính khác cho cùng một phần tử, thuộc tính của phần tử tổ tiên hoặc giá trị của ngữ cảnh định dạng (e. g. , chiều rộng của a ). Khi giá trị phần trăm được đặt cho một thuộc tính của phần tử và tỷ lệ phần trăm được xác định là đề cập đến giá trị kế thừa của một số thuộc tính, giá trị kết quả là tỷ lệ phần trăm nhân với thuộc tính đó

(các) ví dụ

Vì các phần tử con (thường) kế thừa phần tử cha của chúng, nên trong ví dụ sau, các phần tử con của phần tử P sẽ thừa hưởng giá trị 12px cho , không phải giá trị phần trăm (120%)


width: "auto";
border: "none";
background: "red";
4

Các giá trị URI (Mã định danh tài nguyên thống nhất, xem , bao gồm URL, URN, v.v.) trong thông số kỹ thuật này được biểu thị bằng. Ký hiệu chức năng được sử dụng để chỉ định các URI trong các giá trị thuộc tính là "url()", như trong

(các) ví dụ


width: "auto";
border: "none";
background: "red";
5

Định dạng của giá trị URI là 'url(' theo sau là tùy chọn, tiếp theo là ký tự trích dẫn đơn (') hoặc trích dẫn kép (") tùy chọn, theo sau là chính URI, tiếp theo là ký tự trích dẫn đơn (') hoặc trích dẫn kép (" . Hai ký tự trích dẫn phải giống nhau

(các) ví dụ

Một ví dụ không có dấu ngoặc kép


width: "auto";
border: "none";
background: "red";
6

Một số ký tự xuất hiện trong URI không được trích dẫn, chẳng hạn như dấu ngoặc đơn, ký tự khoảng trắng, dấu ngoặc đơn (') và dấu ngoặc kép ("), phải được thoát bằng dấu gạch chéo ngược để giá trị URI kết quả là mã thông báo URI. '\(', '\)'

Tùy thuộc vào loại URI, cũng có thể viết các ký tự trên dưới dạng thoát URI (trong đó "(" = %28, ")" = %29, v.v. ) như được mô tả trong

Lưu ý rằng mã thông báo COMMENT không thể xảy ra trong các mã thông báo khác. do đó, "url(/*x*/pic. png)" biểu thị URI "/*x*/pic. png", không phải "ảnh. png"

Để tạo biểu định kiểu mô-đun không phụ thuộc vào vị trí tuyệt đối của tài nguyên, tác giả có thể sử dụng các URI tương đối. URI tương đối (như được định nghĩa trong ) được phân giải thành URI đầy đủ bằng cách sử dụng URI cơ sở. RFC 3986, phần 5, xác định thuật toán quy chuẩn cho quy trình này. Đối với biểu định kiểu CSS, URI cơ sở là của biểu định kiểu, không phải của tài liệu nguồn

(các) ví dụ

Ví dụ: giả sử quy tắc sau


width: "auto";
border: "none";
background: "red";
7

được đặt trong một biểu định kiểu được chỉ định bởi URI


width: "auto";
border: "none";
background: "red";
8

Nền của CƠ THỂ của tài liệu nguồn sẽ được lát bằng bất kỳ hình ảnh nào được mô tả bởi tài nguyên được chỉ định bởi URI


width: "auto";
border: "none";
background: "red";
9

Tác nhân người dùng có thể khác nhau về cách họ xử lý các URI không hợp lệ hoặc URI chỉ định các tài nguyên không khả dụng hoặc không thể áp dụng

Counters are denoted by case-sensitive identifiers (see the and properties). To refer to the value of a counter, the notation 'counter()'or 'counter(, <'list-style-type'>)', with optional white space separating the tokens, is used. The default style is 'decimal'.

To refer to a sequence of nested counters of the same name, the notation is 'counters(,)' or 'counters(,, <'list-style-type'>)' with optional white space separating the tokens.

Xem trong chương về nội dung được tạo để biết cách tác nhân người dùng phải xác định giá trị hoặc các giá trị của bộ đếm. Xem định nghĩa về các giá trị bộ đếm của thuộc tính để biết cách nó phải chuyển đổi các giá trị này thành một chuỗi

In CSS 2.1, the values of counters can only be referred to from the property. Note that 'none' is a possible <'list-style-type'>: 'counter(x, none)' yields an empty string.

(các) ví dụ

Đây là một style sheet đánh số các đoạn (p) cho mỗi chương (h1). Các đoạn văn được đánh số la mã, sau đó là dấu chấm và khoảng trắng

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name
0

A là từ khóa hoặc thông số kỹ thuật số RGB

Danh sách các từ khóa màu sắc là. nước, đen, xanh dương, hoa vân anh, xám, xanh lá cây, vôi, màu hạt dẻ, hải quân, ô liu, cam, tím, đỏ, bạc, mòng két, trắng và vàng. 17 màu này có giá trị như sau

màu hạt dẻ #800000 đỏ #ff0000 cam #ffA500 vàng #ffff00 ô liu #808000

tím #800080 fuchsia #ff00ff trắng #ffffff vôi #00ff00 xanh lá cây #008000

hải quân #000080 màu xanh lam #0000ff aqua #00ffff xanh mòng két #008080

đen #000000 bạc #c0c0c0 xám #808080

Ngoài các từ khóa màu này, người dùng có thể chỉ định các từ khóa tương ứng với màu được sử dụng bởi các đối tượng nhất định trong môi trường của người dùng. Vui lòng tham khảo phần trên để biết thêm thông tin

(các) ví dụ

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name
1

Mô hình màu RGB được sử dụng trong thông số kỹ thuật màu số. Tất cả các ví dụ này chỉ định cùng một màu

(các) ví dụ

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name
2

Định dạng của một giá trị RGB trong ký hiệu thập lục phân là '#' ngay sau đó là ba hoặc sáu ký tự thập lục phân. Ký hiệu RGB ba chữ số (#rgb) được chuyển đổi thành dạng sáu chữ số (#rrggbb) bằng cách sao chép các chữ số, không phải bằng cách thêm số không. Ví dụ: #fb0 mở rộng thành #ffbb00. Điều này đảm bảo rằng màu trắng (#ffffff) có thể được chỉ định bằng ký hiệu ngắn (#fff) và loại bỏ mọi phụ thuộc vào độ sâu màu của màn hình

Định dạng của giá trị RGB trong ký hiệu chức năng là 'rgb(' theo sau là danh sách ba giá trị số được phân tách bằng dấu phẩy (ba giá trị số nguyên hoặc ba giá trị phần trăm) theo sau là ')'. Giá trị số nguyên 255 tương ứng với 100% và với F hoặc FF trong ký hiệu thập lục phân. rgb(255,255,255) = rgb(100%,100%,100%) = #FFF. các ký tự được phép xung quanh các giá trị số

Tất cả các màu RGB được chỉ định trong không gian màu sRGB (xem tài liệu tham khảo). Các tác nhân người dùng có thể khác nhau về độ trung thực mà chúng đại diện cho các màu này, nhưng việc sử dụng sRGB cung cấp định nghĩa rõ ràng và có thể đo lường khách quan về màu nên có, có thể liên quan đến các tiêu chuẩn quốc tế (xem )

có thể hạn chế nỗ lực hiển thị màu của chúng để thực hiện hiệu chỉnh gamma trên chúng. sRGB chỉ định gamma hiển thị là 2. 2 trong các điều kiện xem được chỉ định. Tác nhân người dùng nên điều chỉnh các màu được cung cấp trong CSS sao cho, khi kết hợp với gamma hiển thị "tự nhiên" của thiết bị đầu ra, gamma hiển thị hiệu quả là 2. 2 được sản xuất. Lưu ý rằng chỉ những màu được chỉ định trong CSS mới bị ảnh hưởng; . g. , hình ảnh phải mang thông tin màu của riêng chúng

Các giá trị bên ngoài gam thiết bị phải được cắt bớt hoặc ánh xạ vào gam khi biết gam. các giá trị đỏ, lục và lam phải được thay đổi để nằm trong phạm vi được thiết bị hỗ trợ. Tác nhân người dùng có thể thực hiện ánh xạ màu chất lượng cao hơn từ gam này sang gam khác. Đối với một màn hình CRT thông thường, có gam thiết bị giống như sRGB, bốn quy tắc dưới đây là tương đương

(các) ví dụ

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name
3

Các thiết bị khác, chẳng hạn như máy in, có gam màu khác với sRGB; . 255 sRGB sẽ được thể hiện (bên trong gam thiết bị), trong khi các màu khác bên trong 0. 255 sRGB sẽ nằm ngoài phạm vi thiết bị và do đó sẽ được ánh xạ

Ghi chú. Ánh xạ hoặc cắt các giá trị màu phải được thực hiện với gam thiết bị thực tế nếu biết (có thể lớn hơn hoặc nhỏ hơn 0. 255)

Chuỗi có thể được viết bằng dấu nháy kép hoặc dấu nháy đơn. Dấu ngoặc kép không thể xảy ra bên trong dấu ngoặc kép, trừ khi thoát (e. g. , dưới dạng '\"' hoặc '\22'). Tương tự cho dấu nháy đơn (e. g. , "\'" hoặc "\27")

(các) ví dụ

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name
4

Một chuỗi không thể trực tiếp chứa một dòng mới. Để bao gồm một dòng mới trong một chuỗi, hãy sử dụng một lối thoát đại diện cho ký tự nguồn cấp dữ liệu theo tiêu chuẩn ISO-10646 (U+000A), chẳng hạn như "\A" hoặc "\00000a". Ký tự này đại diện cho khái niệm chung về "dòng mới" trong CSS. Xem tài sản cho một ví dụ

Có thể ngắt chuỗi trên một số dòng, vì lý do thẩm mỹ hoặc lý do khác, nhưng trong trường hợp như vậy, bản thân dòng mới phải được thoát bằng dấu gạch chéo ngược (\). Chẳng hạn, hai bộ chọn sau hoàn toàn giống nhau

(các) ví dụ

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name
5

Nếu một UA không hỗ trợ một giá trị cụ thể, nó sẽ bỏ qua giá trị đó khi phân tích biểu định kiểu, như thể giá trị đó là một. Ví dụ

(các) ví dụ

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name
6

Một UA hỗ trợ giá trị 'chạy thử' cho thuộc tính 'hiển thị' sẽ chấp nhận khai báo hiển thị đầu tiên và sau đó "ghi đè" giá trị đó bằng khai báo hiển thị thứ hai. Một UA không hỗ trợ giá trị 'run-in' sẽ xử lý khai báo hiển thị đầu tiên và bỏ qua khai báo hiển thị thứ hai

Biểu định kiểu CSS là một chuỗi các ký tự từ Bộ ký tự chung (xem phần ). Để truyền và lưu trữ, các ký tự này phải được mã hóa bằng mã hóa ký tự hỗ trợ bộ ký tự có sẵn trong US-ASCII (e. g. , UTF-8, ISO 8859-x, SHIFT JIS, v.v. ). Để có phần giới thiệu tốt về bộ ký tự và mã hóa ký tự, vui lòng tham khảo đặc tả HTML 4 (, chương 5). Xem thêm XML 1. 0 đặc điểm kỹ thuật (, phần 2. 2 và 4. 3. 3, và Phụ lục F)

Khi một biểu định kiểu được nhúng trong một tài liệu khác, chẳng hạn như trong phần tử STYLE hoặc thuộc tính "kiểu" của HTML, biểu định kiểu sẽ chia sẻ mã hóa ký tự của toàn bộ tài liệu

Khi một biểu định kiểu nằm trong một tệp riêng biệt, tác nhân người dùng phải tuân thủ các ưu tiên sau khi xác định mã hóa ký tự của biểu định kiểu (từ mức ưu tiên cao nhất đến thấp nhất)

  1. Tham số "bộ ký tự" HTTP trong trường "Loại nội dung" (hoặc tham số tương tự trong các giao thức khác)
  2. BOM và/hoặc @charset (xem bên dưới)
  3. red
    
    20 hoặc siêu dữ liệu khác từ cơ chế liên kết (nếu có)
  4. bộ ký tự của biểu định kiểu hoặc tài liệu tham chiếu (nếu có)
  5. Giả sử UTF-8

Tác giả sử dụng quy tắc @charset phải đặt quy tắc ở đầu biểu định kiểu, không có ký tự trước. (Nếu dấu thứ tự byte phù hợp với mã hóa được sử dụng, nó có thể đứng trước quy tắc @charset. )

Sau "@charset", tác giả chỉ định tên của một ký tự mã hóa (trong dấu ngoặc kép). Ví dụ

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name
7

@charset phải được viết theo nghĩa đen, tôi. e. , 10 ký tự '@charset "' (chữ thường, không có dấu gạch chéo ngược thoát), theo sau là tên mã hóa, theo sau là ';'

Tên phải là tên bộ ký tự như được mô tả trong sổ đăng ký IANA. Xem danh sách đầy đủ các bộ ký tự. Tác giả nên sử dụng tên bộ ký tự được đánh dấu là "tên MIME ưa thích" trong sổ đăng ký IANA

Tác nhân người dùng phải hỗ trợ ít nhất mã hóa UTF-8

Tác nhân người dùng phải bỏ qua bất kỳ quy tắc @charset nào không có ở đầu biểu định kiểu. Khi tác nhân người dùng phát hiện mã hóa ký tự bằng BOM và/hoặc quy tắc @charset, họ phải tuân theo các quy tắc sau

  • Trừ khi được chỉ định trong các quy tắc này, tất cả các quy tắc @charset đều bị bỏ qua
  • Mã hóa được phát hiện dựa trên luồng byte bắt đầu biểu định kiểu. Bảng sau đây đưa ra một tập hợp các khả năng cho các chuỗi byte ban đầu (được viết bằng hệ thập lục phân). Hàng đầu tiên khớp với phần đầu của biểu định kiểu cho kết quả phát hiện mã hóa dựa trên quy tắc BOM và/hoặc @charset. Nếu không có hàng nào khớp, mã hóa không thể được phát hiện dựa trên quy tắc BOM và/hoặc @charset. Ký hiệu (. )* đề cập đến sự lặp lại trong đó kết quả phù hợp nhất là lần lặp lại ít lần nhất có thể. Các byte được đánh dấu "XX" là những byte được sử dụng để xác định tên của mã hóa, bằng cách xử lý chúng, theo thứ tự nhất định, dưới dạng một chuỗi các ký tự ASCII. Các byte được đánh dấu "YY" cũng tương tự, nhưng cần được chuyển mã sang ASCII như đã lưu ý. Tác nhân người dùng có thể bỏ qua các mục nhập trong bảng nếu chúng không hỗ trợ bất kỳ mã hóa nào liên quan đến mục nhập. Bytes ban đầuResultEF BB BF 40 63 68 61 72 73 65 74 20 22 (XX)* 22 3Bas được chỉ địnhEF BB BFUTF-840 63 68 61 72 73 65 74 20 22 (XX)* 22 3Bas được chỉ địnhFE FF 00 40 00 63 00 68 00 61 . 38 đến các mẫu tương tự ASCII Tác nhân người dùng có thể hỗ trợ các mẫu bổ sung, tương tự nếu chúng hỗ trợ mã hóa không được xử lý bởi các mẫu tại đây
  • Nếu mã hóa được phát hiện dựa trên một trong các mục trong bảng ở trên được đánh dấu là "như đã chỉ định", tác nhân người dùng sẽ bỏ qua biểu định kiểu nếu nó không phân tích cú pháp quy tắc @charset thích hợp ở đầu luồng ký tự do giải mã trong . Điều này đảm bảo rằng
    • Các quy tắc @charset chỉ hoạt động nếu chúng nằm trong bảng mã của biểu định kiểu,
    • dấu thứ tự byte chỉ bị bỏ qua trong mã hóa hỗ trợ dấu thứ tự byte và
    • tên mã hóa không thể chứa dòng mới

Tác nhân người dùng phải bỏ qua biểu định kiểu trong mã hóa không xác định

Một biểu định kiểu có thể phải tham chiếu đến các ký tự không thể được biểu diễn trong mã hóa ký tự hiện tại. Các ký tự này phải được viết dưới dạng tham chiếu đến các ký tự ISO 10646. Những dấu thoát này có cùng mục đích như tham chiếu ký tự số trong tài liệu HTML hoặc XML (xem, chương 5 và 25)

Cơ chế thoát ký tự nên được sử dụng khi chỉ một vài ký tự phải được biểu diễn theo cách này. Nếu hầu hết biểu định kiểu yêu cầu thoát, tác giả nên mã hóa nó bằng mã hóa phù hợp hơn (e. g. , nếu biểu định kiểu chứa nhiều ký tự Hy Lạp, tác giả có thể sử dụng "ISO-8859-7" hoặc "UTF-8")

Bộ xử lý trung gian sử dụng mã hóa ký tự khác có thể dịch các chuỗi đã thoát này thành chuỗi byte của mã hóa đó. Mặt khác, bộ xử lý trung gian không được thay đổi các chuỗi thoát làm hủy bỏ ý nghĩa đặc biệt của ký tự ASCII

phải ánh xạ chính xác tới ISO-10646 tất cả các ký tự trong bất kỳ mã hóa ký tự nào mà chúng nhận ra (hoặc chúng phải hoạt động như thể chúng đã làm)

Ví dụ: biểu định kiểu được truyền dưới dạng ISO-8859-1 (Latin-1) không thể chứa trực tiếp các chữ cái Hy Lạp. "κουρος" (tiếng Hy Lạp. "kouros") phải được viết là "\3BA\3BF\3C5\3C1\3BF\3C2"

Ghi chú. Trong HTML 4, các tham chiếu ký tự số được diễn giải trong các giá trị thuộc tính "kiểu" chứ không phải trong nội dung của phần tử STYLE. Do sự bất đối xứng này, chúng tôi khuyên các tác giả nên sử dụng cơ chế thoát ký tự CSS thay vì tham chiếu ký tự số cho cả thuộc tính "kiểu" và phần tử STYLE. Ví dụ: chúng tôi khuyên bạn nên

Bộ chọn CSS có thể có số không?

Làm cách nào để viết bộ chọn id trong CSS?

Để sử dụng bộ chọn ID trong CSS, bạn chỉ cần viết thẻ bắt đầu bằng # (#) theo sau là ID của phần tử .

5 bộ chọn trong CSS là gì?

Có nhiều loại bộ chọn cơ bản khác nhau. .
Bộ chọn phần tử
bộ chọn id
Bộ chọn lớp
Bộ chọn chung
Bộ chọn nhóm
Bộ chọn thuộc tính
Bộ chọn lớp giả
Bộ chọn phần tử giả

4 bộ chọn CSS là gì?

Bộ chọn CSS .
Bộ chọn đơn giản (chọn các phần tử dựa trên tên, id, lớp)
Bộ chọn tổ hợp (chọn các phần tử dựa trên mối quan hệ cụ thể giữa chúng)
Bộ chọn lớp giả (chọn các phần tử dựa trên một trạng thái nhất định)
Bộ chọn phần tử giả (chọn và tạo kiểu cho một phần của phần tử)