الفرق بين المراجعتين ل"CSS/counter-reset"

مراجعة 11:59، 27 يوليو 2018

الخاصية counter-reset في CSS تُعيد ضبط قيمة أحد عدّادات CSS إلى قيمة معيّنة، بينما يمكن زيادة أو إنقاص قيمة العداد باستخدام الخاصية counter-increment.

بطاقة الخاصية

القيمة الابتدائية	`none`
تُطبَّق على	كل العناصر.
قابلة للوراثة	لا
قابلة للتحريك	لا
القيمة المحسوبة	كما حُدِّدَت.

/* ضبط قيمة العداد إلى 0 */
counter-reset: my-counter;

/* ضبط قيمة العداد إلى -1 */
counter-reset: my-counter -1;

/* ضبط قيمة أوّل عداد إلى 1 وثاني عدّاد إلى 4 */
counter-reset: counter1 1 counter2 4;

/* إلغاء عملية إعادة التعيين، وتُستخدَم لتجاوز القواعد التي لها أولوية أقل */
counter-reset: none;

/* القيم العامة */
counter-reset: inherit;
counter-reset: initial;
counter-reset: unset;

أمثلة

القاعدة الآتية ستُعيد ضبط قيمة العداد chapter و page إلى 0، وستضبط قيمة العداد section إلى القيمة 1:

h1 {
  counter-reset: chapter section 1 page;
}

دعم المتصفحات

الميزة	Chrome	Firefox	Internet Explorer	Opera	Safari
الدعم الأساسي	2.0	1.0	8.0	9.2	3.1

البنية العامة

تقبل الخاصية counter-reset أحد الأشكال الآتية:

<custom-ident> تُسمي العداد ويتبعها اختياريًا عدد صحيح <integer>، ويمكنك تحديد أي عدد تشاء من العدّادات لإعادة ضبط قيمتها ويُفصَل بين كل زوجين من القيم بفراغ.
الكلمة المحجوزة none.

`<custom-ident>`

اسم العدّاد الذي نريد إعادة تعيين قيمته.

`<integer>`

القيمة التي سيُضبَط إليها العداد، والقيمة الافتراضية هي 0.

`none`

لا يجب إعادة تعيين أيّ عداد، وتُستخدَم هذه القيمة كقيمة افتراضية، أو لإلغاء إعادة تعيين قيمة العدادات إذا كانت درجة تحديد القاعدة أكبر.

البنية الرسمية

counter-reset: [ <custom-ident> <integer>? ]+ | none

مصادر ومواصفات

مسودة CSS Lists and Counters Module Level 3.
مواصفة ‎CSS Level 2 (Revision 1)‎.

@@ سطر 1: / سطر 1: @@
 <noinclude>{{DISPLAYTITLE:الخاصية <code>counter-reset</code>}}</noinclude>
-الخاصية <code>counter-reset</code> في CSS تُعيد ضبط قيمة أحد عدّادات CSS إلى قيمة معيّنة، بينما يمكن زيادة أو إنقاص قيمة العداد باستخدام الخاصية <code>[[CSS/counter-increment|counter-increment]]</code>.<syntaxhighlight lang="css">
+الخاصية <code>counter-reset</code> في CSS تُعيد ضبط قيمة أحد عدّادات CSS إلى قيمة معيّنة، بينما يمكن زيادة أو إنقاص قيمة العداد باستخدام الخاصية <code>[[CSS/counter-increment|counter-increment]]</code>.
+== بطاقة الخاصية ==
+{| class="wikitable" style="width: 100%;"
+|-
+! scope="row" style="width: 20%;" |[[CSS/initial value|القيمة الابتدائية]]
+|<code>none</code>
+|-
+! scope="row" |تُطبَّق على
+|كل العناصر.
+|-
+! scope="row" |قابلة للوراثة
+|لا
+|-
+!قابلة للتحريك
+|لا
+|-
+! scope="row" |القيمة المحسوبة
+|كما حُدِّدَت.
+|}
+<syntaxhighlight lang="css">
 /* ضبط قيمة العداد إلى 0 */
 counter-reset: my-counter;
@@ سطر 19: / سطر 39: @@
 </syntaxhighlight>
-{| class="wikitable" style="width: 100%;"
-|-
-! scope="row" style="width: 20%;" |[[CSS/initial value|القيمة الابتدائية]]
-|<code>none</code>
-|-
-! scope="row" |تُطبَّق على
-|كل العناصر.
-|-
-! scope="row" |قابلة للوراثة
-|لا
-|-
-!قابلة للتحريك
-|لا
-|-
-! scope="row" |القيمة المحسوبة
-|كما حُدِّدَت.
-|}
 == أمثلة ==
 القاعدة الآتية ستُعيد ضبط قيمة العداد <code>chapter</code> و <code>page</code> إلى 0، وستضبط قيمة العداد <code>section</code> إلى القيمة <code>1</code>: <syntaxhighlight lang="css">
@@ سطر 61: / سطر 65: @@
 == البنية العامة ==
 تقبل الخاصية <code>counter-reset</code> أحد الأشكال الآتية:
-* قيمة <code>[[CSS/custom-ident|<custom-ident>]]</code> تُسمي العداد ويتبعها اختياريًا عدد صحيح <code>[[CSS/integer|<integer>]]</code>، ويمكنك تحديد أي عدد تشاء من العدّادات لإعادة ضبط قيمتها ويُفصَل بين كل زوجين من القيم بفراغ.
+* <code>[[CSS/custom-ident|<custom-ident>]]</code> تُسمي العداد ويتبعها اختياريًا عدد صحيح <code>[[CSS/integer|<integer>]]</code>، ويمكنك تحديد أي عدد تشاء من العدّادات لإعادة ضبط قيمتها ويُفصَل بين كل زوجين من القيم بفراغ.
 * الكلمة المحجوزة <code>none</code>.
-=== القيمة <code>[[CSS/custom-ident|<custom-ident>]]</code> ===
+===  <code>[[CSS/custom-ident|<custom-ident>]]</code> ===
 اسم العدّاد الذي نريد إعادة تعيين قيمته.
-=== القيمة <code>[[CSS/integer|<integer>]]</code> ===
+===  <code>[[CSS/integer|<integer>]]</code> ===
 القيمة التي سيُضبَط إليها العداد، والقيمة الافتراضية هي <code>0</code>.
-=== القيمة <code>none</code> ===
+===  <code>none</code> ===
 لا يجب إعادة تعيين أيّ عداد، وتُستخدَم هذه القيمة كقيمة افتراضية، أو لإلغاء إعادة تعيين قيمة العدادات إذا كانت درجة تحديد القاعدة أكبر.