الفرق بين المراجعتين ل"CSS/tab-size"
< CSS
اذهب إلى التنقل
اذهب إلى البحث
| سطر 39: | سطر 39: | ||
مثال عن استخدام الخاصية <code>tab-size</code> على عنصر <code>[[HTML/pre|<nowiki><pre></nowiki>]]</code> (لاحظ أنَّ الحالة الوحيدة التي سيُعرَض فيها محرف tab في مستندات HTML هي داخل العنصر <code>[[HTML/pre|<nowiki><pre></nowiki>]]</code> أو إذا ضبطنا قيمة الخاصية <code>[[CSS/white-space|white-space]]</code> إلى <code>pre</code> أو <code>pre-wrap</code>):<syntaxhighlight lang="html"> | مثال عن استخدام الخاصية <code>tab-size</code> على عنصر <code>[[HTML/pre|<nowiki><pre></nowiki>]]</code> (لاحظ أنَّ الحالة الوحيدة التي سيُعرَض فيها محرف tab في مستندات HTML هي داخل العنصر <code>[[HTML/pre|<nowiki><pre></nowiki>]]</code> أو إذا ضبطنا قيمة الخاصية <code>[[CSS/white-space|white-space]]</code> إلى <code>pre</code> أو <code>pre-wrap</code>):<syntaxhighlight lang="html"> | ||
<pre>I have tabs inside! tab-size: initial;</pre> | <pre>I have tabs inside! tab-size: initial;</pre> | ||
| − | <pre class="tab-2"> | + | <pre class="tab-2">tab تم استعمال المسافة! tab-size: 2;</pre> |
| − | <pre class="tab-4"> | + | <pre class="tab-4">tab تم استعمال المسافة! tab-size: 4;</pre> |
| − | <pre class="tab-6"> | + | <pre class="tab-6">tab تم استعمال المسافة! tab-size: 6;</pre> |
| − | <pre class="tab-em"> | + | <pre class="tab-em">tab تم استعمال المسافة! tab-size: 1em;</pre> |
</syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css"> | </syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css"> | ||
.tab-2 { tab-size: 2; } | .tab-2 { tab-size: 2; } | ||
مراجعة 10:08، 12 أغسطس 2018
الخاصية tab-size في CSS تُستعمل لتخصيص عرض محرف الجدولة (tab) الذي له الرمز U+0009 في يونيكود.
بطاقة الخاصية
| القيمة الابتدائية | 8
|
|---|---|
| تُطبَّق على | الحاويات الكتلية. |
| قابلة للوراثة | نعم |
| قابلة للتحريك | نعم |
| القيمة المحسوبة | كما حُدِّدت. |
/* <integer> قيم عددية */
tab-size: 4;
tab-size: 0;
/* <length> قيم طولية */
tab-size: 10px;
tab-size: 2em;
/* قيم عامة */
tab-size: inherit;
tab-size: initial;
tab-size: unset;
أمثلة
مثال عن استخدام الخاصية tab-size على عنصر <pre> (لاحظ أنَّ الحالة الوحيدة التي سيُعرَض فيها محرف tab في مستندات HTML هي داخل العنصر <pre> أو إذا ضبطنا قيمة الخاصية white-space إلى pre أو pre-wrap):
<pre>I have tabs inside! tab-size: initial;</pre>
<pre class="tab-2">tab تم استعمال المسافة! tab-size: 2;</pre>
<pre class="tab-4">tab تم استعمال المسافة! tab-size: 4;</pre>
<pre class="tab-6">tab تم استعمال المسافة! tab-size: 6;</pre>
<pre class="tab-em">tab تم استعمال المسافة! tab-size: 1em;</pre>
شيفرة CSS:
.tab-2 { tab-size: 2; }
.tab-4 { tab-size: 4; }
.tab-6 { tab-size: 6; }
.tab-em { tab-size: 1em; }
دعم المتصفحات
| الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| الدعم الأساسي | 21 | 4.0 | غير مدعومة | 15 | 6.1 |
| <length> | 42 | 53.0 | غير مدعومة | 29 | غير مدعومة |
متصفح Edge لا يدعم هذه الخاصية.
البنية العامة
تقبل الخاصية tab-size إحدى القيمتين التاليتين.
<integer>
عدد الفراغات الموجودة في محرف tab واحد. يجب ألّا تكون هذه القيمة سالبةً.
<length>
عرض محرف tab واحد. يجب ألّا تكون هذه القيمة سالبةً.
البنية الرسمية
tab-size: <integer> | <length>;
انظر أيضًا
- صفحة الخاصية
line-heightالتي تضبط المسافة المستخدم للأسطر. - صفحة الخاصية
letter-spacingالتي تُحدِّد ما هو التباعد بين الأحرف النصية.
مصادر ومواصفات
- مسودة CSS Text Module Level 3.