Thuộc tính counter-increment trong CSS

Định nghĩa và cách sử dụng

Thuộc tính counter-increment thiết lập giá trị tăng đếm của bộ đếm mỗi khi chọn thủ công xuất hiện. Giá trị tăng mặc định là 1.

Giải thích

Sử dụng thuộc tính này, bộ đếm có thể tăng (hoặc giảm) một giá trị nào đó, có thể là giá trị dương hoặc âm. Nếu không cung cấp giá trị number, mặc định là 1.

Ghi chú:Nếu sử dụng "display: none", thì không thể tăng số. Nếu sử dụng "visibility: hidden", thì có thể tăng số.

Xem thêm:

Tài liệu tham khảo CSS:Phụ元素 :before CSS

Tài liệu tham khảo CSS:Phụ元素 :after CSS

Tài liệu tham khảo CSS:Thuộc tính content

Tài liệu tham khảo CSS:Thuộc tính counter-reset

Hàm CSS:Hàm counter()

Tài liệu tham khảo HTML DOM:Thuộc tính counterIncrement

Mẫu

Cách đặt số cho phần và phần con (ví dụ "Section 1", "1.1", "1.2"):

body
  {
  counter-reset:section;
  }
h1
  {
  counter-reset:subsection;
  }
h1:before
  {
  content:"Section " counter(section) ". ";
  counter-increment:section;
  }
h2:before
  {
  counter-increment:subsection;
  content:counter(section) "." counter(subsection) ";
  }

Thử ngay

Cú pháp CSS

counter-increment: none|id|initial|inherit;

Giá trị thuộc tính

Giá trị Mô tả
none Mặc định. Chọn器 không có giá trị tăng số.
id number

id Định nghĩa bộ lọc, id hoặc class sẽ tăng số.

number Định nghĩa giá trị tăng. Số có thể là số dương, số không hoặc số âm.
inherit Định nghĩa giá trị thuộc tính counter-increment được kế thừa từ phần tử cha.

Chi tiết kỹ thuật

Giá trị mặc định: none
Kế thừa: no
Phiên bản: CSS2
Cú pháp JavaScript: object.style.counterIncrement="subsection"

Hỗ trợ trình duyệt

Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ hoàn toàn thuộc tính này.

Chrome IE / Edge Firefox Safari Opera
4.0 8.0 2.0 3.1 9.6

Ghi chú:Nếu đã quy định !DOCTYPE, thì Internet Explorer 8 (và các phiên bản cao hơn) hỗ trợ thuộc tính counter-increment.