وظيفة 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 أو دالة symbols()).

القيمة الافتراضية decimal.

تفاصيل التقنية

الإصدار: CSS3

دعم المتصفح

كروم إدج فايرفوكس سفاري أوبرا
دعم دعم دعم دعم دعم

صفحة ذات الصلة

دروس:محاسبة CSS

المرجع:خصائص content لـ CSS

المرجع:خصائص counter-increment لـ CSS

المرجع:خصائص counter-reset لـ CSS

المرجع:قاعدة @counter-style CSS

المرجع:دالة counter() CSS