الفرق بين المراجعتين ل"CSS/counter-increment"
< CSS
اذهب إلى التنقل
اذهب إلى البحث
ط (استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}') |
|||
| سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE:الخاصية <code>counter-increment</code>}}</noinclude> | <noinclude>{{DISPLAYTITLE:الخاصية <code>counter-increment</code>}}</noinclude> | ||
| − | الخاصية <code>counter-increment</code> في CSS تُزيد أو تُنقِص قيمة أحد عدّادات CSS بقيمة معيّنة، ويمكن إعادة تعيين العدّاد إلى رقم معيّن باستخدام الخاصية <code>[[CSS/counter-reset|counter-reset]]</code>.<syntaxhighlight lang="css"> | + | الخاصية <code>counter-increment</code> في CSS تُزيد أو تُنقِص قيمة أحد عدّادات CSS بقيمة معيّنة، ويمكن إعادة تعيين العدّاد إلى رقم معيّن باستخدام الخاصية <code>[[CSS/counter-reset|counter-reset]]</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"> | ||
/* الزيادة بمقدار 1 */ | /* الزيادة بمقدار 1 */ | ||
counter-increment: my-counter; | counter-increment: my-counter; | ||
| سطر 19: | سطر 39: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| − | + | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
== أمثلة == | == أمثلة == | ||
القاعدة الآتية ستزيد من قيمة العداد <code>chapter</code> و <code>page</code> بمقدار <code>1</code>، وستزيد العداد <code>section</code> بمقدار <code>2</code>: <syntaxhighlight lang="css"> | القاعدة الآتية ستزيد من قيمة العداد <code>chapter</code> و <code>page</code> بمقدار <code>1</code>، وستزيد العداد <code>section</code> بمقدار <code>2</code>: <syntaxhighlight lang="css"> | ||
| سطر 61: | سطر 65: | ||
== البنية العامة == | == البنية العامة == | ||
تقبل الخاصية <code>counter-increment</code> أحد الأشكال الآتية: | تقبل الخاصية <code>counter-increment</code> أحد الأشكال الآتية: | ||
| − | * | + | * <code>[[CSS/custom-ident|<custom-ident>]]</code> تُسمي العداد ويتبعها اختياريًا عدد صحيح <code>[[CSS/integer|<integer>]]</code>، ويمكنك تحديد أي عدد تشاء من العدّادات لزيادة أو إنقاص قيمتها ويُفصَل بين كل زوجين من القيم بفراغ. |
* الكلمة المحجوزة <code>none</code>. | * الكلمة المحجوزة <code>none</code>. | ||
| − | === | + | === <code>[[CSS/custom-ident|<custom-ident>]]</code> === |
اسم العدّاد الذي نريد زيادة أو إنقاص قيمته. | اسم العدّاد الذي نريد زيادة أو إنقاص قيمته. | ||
| − | === | + | === <code>[[CSS/integer|<integer>]]</code> === |
القيمة التي ستُضاف إلى العداد، والقيمة الافتراضية هي <code>1</code>. | القيمة التي ستُضاف إلى العداد، والقيمة الافتراضية هي <code>1</code>. | ||
| − | === | + | === <code>none</code> === |
لا يجب زيادة أيّ عداد، وتُستخدَم هذه القيمة كقيمة افتراضية، أو لإلغاء زيادة أو إنقاص العدادات إذا كانت درجة تحديد القاعدة أكبر. | لا يجب زيادة أيّ عداد، وتُستخدَم هذه القيمة كقيمة افتراضية، أو لإلغاء زيادة أو إنقاص العدادات إذا كانت درجة تحديد القاعدة أكبر. | ||
مراجعة 11:57، 27 يوليو 2018
الخاصية counter-increment في CSS تُزيد أو تُنقِص قيمة أحد عدّادات CSS بقيمة معيّنة، ويمكن إعادة تعيين العدّاد إلى رقم معيّن باستخدام الخاصية counter-reset.
بطاقة الخاصية
| القيمة الابتدائية | none
|
|---|---|
| تُطبَّق على | كل العناصر. |
| قابلة للوراثة | لا |
| قابلة للتحريك | لا |
| القيمة المحسوبة | كما حُدِّدَت. |
/* الزيادة بمقدار 1 */
counter-increment: my-counter;
/* الإنقاص بمقدار 1 */
counter-increment: my-counter -1;
/* زيادة أحد العدادات بمقدار 1 وإنقاص الثاني بمقدار 4*/
counter-increment: counter1 counter2 -4;
/* عدم زيادة أو إنقاص أيّ عداد، وتُستخدَم لتجاوز القواعد التي لها أولوية أقل */
counter-increment: none;
/* القيم العامة */
counter-increment: inherit;
counter-increment: initial;
counter-increment: unset;
أمثلة
القاعدة الآتية ستزيد من قيمة العداد chapter و page بمقدار 1، وستزيد العداد section بمقدار 2:
h1 {
counter-increment: chapter section 2 page;
}
دعم المتصفحات
| الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| الدعم الأساسي | 2.0 | 1.0 | 8.0 | 9.2 | 1.0 |
البنية العامة
تقبل الخاصية counter-increment أحد الأشكال الآتية:
<custom-ident>تُسمي العداد ويتبعها اختياريًا عدد صحيح<integer>، ويمكنك تحديد أي عدد تشاء من العدّادات لزيادة أو إنقاص قيمتها ويُفصَل بين كل زوجين من القيم بفراغ.- الكلمة المحجوزة
none.
<custom-ident>
اسم العدّاد الذي نريد زيادة أو إنقاص قيمته.
<integer>
القيمة التي ستُضاف إلى العداد، والقيمة الافتراضية هي 1.
none
لا يجب زيادة أيّ عداد، وتُستخدَم هذه القيمة كقيمة افتراضية، أو لإلغاء زيادة أو إنقاص العدادات إذا كانت درجة تحديد القاعدة أكبر.
البنية الرسمية
counter-increment: [ <custom-ident> <integer>? ]+ | none
مصادر ومواصفات
- مسودة CSS Lists and Counters Module Level 3.
- مواصفة CSS Level 2 (Revision 1).