Định nghĩa và sử dụng
Thuộc tính counter-increment khi sử dụng sẽ gia tăng một hoặc nhiều counter (sắp xếp có thứ tự, có hiển thị số).
Cấu trúc
tag { counter-increment: giá trị; }
Với giá trị như sau:
Thuộc tính | giá trị | Ví dụ | Mô tả |
---|---|---|---|
counter-increment | giá trị id | counter-increment: tenBatky; | Sử dụng một tên nào đó để xác định sự liên quan giữa các giá trị counter-increment và content. |
none | counter-increment: none; | Thành phần không được gia tăng. | |
inherit | counter-increment: inherit; | Xác định thừa hưởng thuộc tính từ thành phần cha (thành phần bao ngoài). |
Ví dụ
HTML viết:
<html> <head></head> <body> <p>HTML/XHTML</p> <p>CSS</p> <p>JQUERY</p> <p>JAVASCRIPT</p> </body> </html>
Hiển thị trình duyệt khi chưa có CSS:
HTML/XHTML
CSS
JQUERY
JAVASCRIPT
CSS viết:
body {counter-reset: tenBatKy;} p:before { counter-increment: tenBatKy; content: counter(tenBatKy) "."; }
Hiển thị trình duyệt khi có CSS:
HTML/XHTML
CSS
JQUERY
JAVASCRIPT
Trình duyệt hỗ trợ
Thuộc tính counter-increment được hỗ trợ trong đa số các trình duyệt.
IE8 đòi hỏi phải có !Doctype