توابع counters() در CSS

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

CSS counters() این تابع مقدار فعلی شمارنده‌های نام‌گذاری شده و شمارنده‌های درون‌گذاری شده را به صورت رشته‌ای بازمی‌گرداند.

در اینجا از counters() این تابع یک رشته را بین شمارنده‌های سطح مختلف قرار می‌دهد.

مثال

مثال 1

در اینجا از counters() این تابع یک رشته را بین شمارنده‌های سطح مختلف قرار می‌دهد (یک نقطه):

ol {
  counter-reset: section;
  list-style-type: none;
}
li::before {
  counter-increment: section;
  content: counters(section,".") " ";
}

سعی کنید خودتان امتحان کنید

مثال 2

سبک شمارنده را تنظیم کنید و رشته‌ای که به آن متصل می‌شود را به "-" تنظیم کنید:

ol {
  counter-reset: section;
  list-style-type: none;
}
li::before {
  counter-increment: section;
  content: counters(section, "-", lower-alpha) " ";
}

سعی کنید خودتان امتحان کنید

زبان CSS

counters(countername, string, counterstyle)
مقدار توضیح
countername

ضروری. نام شمارنده (همان نامی که در ویژگی‌های counter-reset و counter-increment استفاده می‌شود).

توجه داشته باشید که نام‌ها بزرگ‌کوچک‌نویسی حساس هستند.
string ضروری. رشته‌ای که به آن متصل می‌شود. می‌تواند تعداد متن‌های متنوع باشد.
counterstyle

اختیاری. سبک شمارنده (می‌تواند مقدار list-style-type، نام @counter-style یا نمادهای function() باشد).

مقدار پیش‌فرض decimal است.

جزئیات فنی

ورژن: CSS3

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

کروم ایج فایرفاکس سافاری آپرا
سپورتی سپورتی سپورتی سپورتی سپورتی

相关页面

تعلیم:CSS کاؤنٹر

مطابقت:CSS کنٹینٹ اپریشن

مطابقت:CSS کاؤنٹر انکریمنت اپریشن

مطابقت:CSS کاؤنٹر ریسیٹ اپریشن

مطابقت:CSS @counter-style قوانین

مطابقت:CSS counter() فنکشن