kauye CSS line-height
- الصفحة السابقة letter-spacing
- Page kadib list-style
التعريف والاستخدام
تحدد خاصية line-height مسافة بين السطور (ارتفاع السطر).
ملاحظة:لا يُسمح باستخدام القيم السلبية.
الشرح
تؤثر هذه الخاصية على ترتيب حاوية السطر. عند تطبيقها على عنصر بلوك، فإنها تحدد المسافة الأدنى بين الأسس بين العناصر بدلاً من المسافة القصوى.
يتم تقسيم الفرق بين القيمة الحسابية لـ line-height و font-size (في CSS يُدعى بـ 'space between lines') إلى نصفين، ويتم إضافتهما إلى أعلى وأسفل محتوى السطر. يمكن أن تحتوي هذه المحتويات على أقل حاوية ممكنة هي حاوية السطر.
يحدد القيمة الرقمية الأصلية معامل التكبير، حيث تنقل هذه المعامل إلى العناصر الوراثية بدلاً من القيمة المحسوبة.
انظر أيضًا:
دليل CSShanyin 文本
دليل 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 |
جافا سكربت الجملة: | object.style.lineHeight="2" |
مثال TIY
- استخدام نسبة مئوية لضبط مسافة السطر
- هذا المثال يوضح كيفية استخدام نسبة مئوية لضبط مسافة السطر في الفقرة.
- استخدام قيمة بكسل لضبط مسافة السطر
- هذا المثال يوضح كيفية استخدام قيمة بكسل لضبط مسافة السطر في الفقرة.
- استخدام عدد لضبط مسافة السطر
- هذا المثال يوضح كيفية استخدام عدد لضبط مسافة السطر في الفقرة.
دعم المتصفح
الرقم في الجدول يوضح إصدار المتصفح الأول الذي يدعم هذه الخاصية بشكل كامل.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
1.0 | 4.0 | 1.0 | 1.0 | 7.0 |
- الصفحة السابقة letter-spacing
- Page kadib list-style