خصائص line-height CSS
- الصفحة السابقة letter-spacing
- الصفحة التالية list-style
تعريف والاستخدام
تُستخدم خاصية line-height لضبط مسافة السطر بين الأعمدة (ارتفاع السطر).
ملاحظة:لا يُسمح باستخدام القيم السلبية.
شرح
تؤثر هذه الخاصية على تخطيط حاوية السطر. عند تطبيقها على عنصر مكدس، فإنها تحدد المسافة الأدنى بين الأسطر بدلاً من المسافة القصوى.
يتم تقسيم الفرق بين القيمة الحسابية لـ line-height و font-size (في CSS يُدعى بـ 'space between lines') إلى نصفين ويتم إضافتهما إلى أعلى وأسفل محتوى السطر. يمكن أن تكون أقل حاوية تحتوي على هذه المحتويات هي حاوية السطر.
يحدد القيمة الرقمية الأصلية معامل التكبير، وستورث العناصر اللاحقة هذا المعامل بدلاً من القيمة الحسابية.
يرجى الرجوع أيضًا إلى:
دليل CSSنص CSS
دليل HTML DOMخاصية lineHeight
مثال
ضبط الارتفاع السطر بنسبة مئوية:
p.small {line-height:90%}
p.big {line-height:200%}
يمكنك مشاهدة أمثلة إضافية في أسفل الصفحة.
نحوية CSS
line-height: normal|number|length|initial|inherit;
قيمة الخاصية
| القيمة | وصف |
|---|---|
| normale | افتراضي. ضبط مسافة السطر المناسبة. |
| number | ضبط عدد، هذا العدد سيتم ضربه مع حجم الخط الحالي لضبط مسافة السطر. |
| length | ضبط مسافة السطر الثابتة. |
| % | نسبة مئوية للسطر بين الأعمدة بناءً على حجم الخط الحالي. |
| inherit | يحدد هذا أن يجب استيراد قيمة خاصية line-height من العنصر الأم. |
تفاصيل التقنية
| القيمة الافتراضية: | normale |
|---|---|
| تنحيب: | نعم |
| الإصدار: | CSS1 |
| جافا سكريبت نحوية: | الجسم.style.lineHeight="2" |
TIY مثال
- استخدام نسبة مئوية لضبط مسافة السطر
- هذا المثال يوضح كيفية استخدام نسبة مئوية لضبط مسافة السطر في الفقرة.
- استخدام قيمة بكسل لضبط مسافة السطر
- هذا المثال يوضح كيفية استخدام قيمة بكسل لضبط مسافة السطر في الفقرة.
- استخدام عدد لضبط مسافة السطر
- هذا المثال يوضح كيفية استخدام عدد لضبط مسافة السطر في الفقرة.
دعم المتصفح
الرقم في الجدول يوضح الإصدار الأولي من المتصفح الذي يدعم هذه الخاصية.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 4.0 | 1.0 | 1.0 | 7.0 |
- الصفحة السابقة letter-spacing
- الصفحة التالية list-style
