CSS Height
خاصية height للتحكم في طول العناصر في لغة CSS
ستتعلم في هذا الدرس التحكم في طول عناصر HTML بأستخدام خاصية height, كما يمكن إعادة ضبط طول العناصر في لغة CSS.
التاريخ
11 نوفمبر 2022
الدروس
137
المستوى
مبتدئ
اللغة
انجليزي
المشاهدات
1670
المواضيع
24
CSS Heigh
طول العناصر في لغة CSS
</>
CSS Heigh
طول العناصر في لغة CSS
تستخدم خاصية height في ضبط + التحكم في طول عناصر HTML علي المتُصفح بلغة CSS, يكون طول العنصر في الوضع الإفتراضي بطول المحتوي الداخلي.
قيم خاصية height في لغة CSS:
- auto المتصفح يقوم بضبط طول العنصر تلقائي علي حسب حجم المحتوي, وهي القيمة الأفتراضية.
- length ضبط الطول بوحدات مختلفة مثل px,cm,em,rem.
- percentage ضبط الطول بالنسبة المئوية % علي حسب العنصر الأب parent.
CSS height syntax
طريقة كتابة خاصية height في لغة CSS.
height:value;
CSS height values
قيم خاصية height في لغة CSS.
height:auto|length|percentage|initial|inherit;
مهم
طول العنصر لا يشمل المساحات الخاصة margin الهوامش الخارجية و padding الهوامش الداخلية و borders الإطار الداخلي, يتم إضافة مساحة الطول داخل العنصر أسفل margin و padding و borders.
</>
CSS height auto
خاصية height مع القيمة auto في لغة CSS
يتم إحتساب طول العنصر بواسطة المتصفح تلقائياً مع إضافة خاصية height مع القيمة auto في لغة CSS.
CSS height auto
خاصية height والقيمة auto في لغة CSS.
p { height: auto; border: 1px solid red; }
</>
CSS height length
خاصية height مع القيمة length في لغة CSS
يتم إحتساب طول العنصر بوحدات مختلفة مثل pixel البيكسل مع إضافة خاصية height مع القيمة length في لغة CSS.
CSS height length
خاصية height والقيمة length في لغة CSS.
p { height:100px; border: 1px solid red; }
</>
CSS height percentage
خاصية height مع القيمة percentage في لغة CSS
يتم إحتساب طول العنصر بالنسبة المئوية مع إضافة خاصية height مع القيمة percentage % في لغة CSS.
CSS height percentage
خاصية height والقيمة percentage في لغة CSS.
p { height:50%; border: 1px solid red; }