min-height Property
ویژگی min-height
در CSS کمترین اندازه ارتفاع عنصر را مشخص می کند. اگر اندازه ارتفاع محتوای عنصر بیشتر از میزان تعیین شده توسط min-height
باشد، این ویژگی تاثیر نخواهد داشت.
نحوه نوشتار
/* استفاده از واحد های اندازه (طول) */ min-height: 3.5em; /* مقدار با درصد */ min-height: 75%; /* مقدار یا کلیدواژه */ min-height: none;
مقادیر
طول (واحدهای اندازه)
کمترین اندازه ارتفاع عنصر توسط مقادیری بر اساس px,
cm
, rem
و .. مشخص می شود. مقدار پیشفرض 0
می باشد.
درصد
کمترین اندازه ارتفاع را بر حسب درصدی از ارتفاع عنصر والد تعیین می کند.
auto
اندازه این ویژگی را مرورگر محاسبه و اعمال می کند.
html
<div class="p1"> <div>min-height: <span>20px</span></div> لورم ایپسوم یا طرحنما (به انگلیسی: Lorem ipsum) به متنی آزمایشی و بیمعنی در صنعت چاپ، صفحهآرایی و طراحی گرافیک گفته میشود. </div> <div class="p2"> <div>min-height: <span>230px</span></div> لورم ایپسوم یا طرحنما (به انگلیسی: Lorem ipsum) به متنی آزمایشی و بیمعنی در صنعت چاپ، صفحهآرایی و طراحی گرافیک گفته میشود. </div>
css
div { width: 200px; } .p1 { background-color: lightgreen; min-height: 20px; } .p2 { background-color: lightblue; min-height: 230px; }
مشاهده و ویرایش کد در حالت تمام صفحه
پشتیبانی مرورگرها
تمام مرورگرها از این ویژگی در CSS پشتیبانی می کنند.