ویژگی counter-increment CSS

تعریف و استفاده

ویژگی counter-increment مقدار افزایش شمارنده برای هر انتخاب‌کننده‌ای که ظاهر می‌شود را تنظیم می‌کند. مقدار پیش‌فرض افزایش 1 است.

توضیحات

با استفاده از این ویژگی، شمارنده می‌تواند یک مقدار را افزایش (یا کاهش) دهد، که می‌تواند مقدار مثبت یا منفی باشد. اگر مقدار number ارائه نشده باشد، مقدار پیش‌فرض 1 است.

توجه:اگر از "display: none" استفاده شده باشد، نمی‌توان شمارش را افزایش داد. اگر از "visibility: hidden" استفاده شود، می‌توان شمارش را افزایش داد.

لطفاً به:

دستورالعمل CSSعنصر مخفی :before CSS

دستورالعمل CSSعنصر مخفی :after CSS

دستورالعمل CSSویژگی content

دستورالعمل CSSویژگی counter-reset

توابع CSSتوابع counter()

دستورالعمل HTML DOMویژگی counterIncrement

مثال

روشی برای شماره‌گذاری بخش‌ها و زیربخش‌ها (مثلاً "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) ";
  }

آزمایش کنید

نوشتار CSS

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

مقدار ویژگی

مقدار توضیح
none پیش‌فرض. انتخابگر هیچ مقدار افزایشی ندارد.
id number

id تعریف انتخابگر، id یا class که باید به شمارش اضافه شود.

number تعریف مقدار افزایش. number می‌تواند عدد مثبت، صفر یا منفی باشد.
inherit مقدار counter-increment باید از عنصر والد به ارث برسد.

جزئیات فنی

مقدار پیش‌فرض: none
وراثت: no
نسخه: CSS2
نوشتار JavaScript: object.style.counterIncrement="subsection"

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگر هستند که از این ویژگی پشتیبانی می‌کند.

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

توجه:اگر !DOCTYPE تعیین شده باشد، اینترنت اکسپلورر 8 (و نسخه‌های بالاتر) از ویژگی counter-increment پشتیبانی می‌کند.