انتقل إلى محتوى الدرس

CSS Max Height خاصية max-height للتحكم في أقصي طول للعنصر بلغة CSS

ستتعلم في هذا الدرس التحكم في أقصي طول لعناصر HTML باستخدام خاصية max-height في لغة CSS.

1 صفوف تعليمية
لغة CSS
3,704 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تستخدم خاصية max-height في ضبط + التحكم في أقصي طول ممكن لعناصر HTML علي المتُصفح بلغة CSS, لو زاد حجم محتوي العنصر علي أقصي طول للعنصر max-wdith بشكل تلقائي سوف يطفح المحتوي خارج العنصر ولكن عن طريق خاصية overflow يممكن معالجة هذا الأمر.

  • لو المحتوي أقل من طول العنصر فأن خاصية max-height لا تؤثر علي العنصر ويكون ليس لها وظيفة في هذة الحالة.
  • في حال أن للعنصر طول بخاصية height أكبر من خاصية max-height فأن الطول الُمحدد بخاصية max-height يكون هو الزي له تأثير علي العنصر ويلغي الطول المٌحدد بخاصية height.


قيم خاصية max-height في لغة CSS:

  • none هي الوضع الأفتراضي وأن العنصر ليس له حد أقصي للطول ويعمل فقط بخاصية height.
  • length ضبط أقصي طول للعنصر  بوحدات مختلفة مثل px,cm,em,rem.
  • percentage ضبط أقصي طول للعنصر بالنسبة المئوية % علي حسب العنصر الأب parent.

CSS max-height syntax

طريقة كتابة خاصية max-height في لغة CSS.

HTML
max-height:value;

CSS max-height values

قيم خاصية max-height في لغة CSS.

HTML
max-height:none|length|initial|inherit;