خصوصیت display
مثال (خصوصیت display)
نمایش عنصر <P> به عنوان یک عنصر inline:
{
display:inline;
}
تعریف و کاربرد
با استفاده از خاصیت display می توانیم نوع boxی که برای عنصر به کار رفته است را مشخص کنیم.
مقدار پیشفرض | inline |
---|---|
ارث بری | خیر |
نسخه | CSS1 |
JavaScript ساختار | object.style.display="block" |
پشتیبانی مرورگرها
تمام مرورگرهای اصلی، خصوصیت display را پشتیبانی می کنند.
توجه: مرورگر Internet Explorer 7 و نسخه های قبلی آن، مقادیر "inline-table", "table", "table-caption", "table-cell", column", "table-column-group", "table-row", "table-row-group", , و "inherit" را پشتیبانی نمی کند.
IE8 به !DOCTYPE! نیاز دارد. IE9 مقدار "inherit" را پشتیبانی می کند.
مقدارهای خصوصیت
مقدار | توضیحات | نمایش دادن |
---|---|---|
inline | عناصر را به صورت inline نمایش می دهد (مانند <span>). این مقدار پیش فرض است. | نمایش دادن » |
block | یک عنصر را به صورت block نمایش می دهد (مانند block). | نمایش دادن » |
inline-block |
یک ظرف inline تعریف می کند که عناصر داخل آن به صورت block نمایش داده می شود. |
|
inline-table |
عنصر را به صورت جدول inline نمایش می دهد. |
|
list-item |
عناصر را مانند عنصر li در نظر می گیرد. |
نمایش دادن » |
run-in |
یک عنصر بسته به محتوا، یا به صورت block یا به صورت inline در نظر گرفته می شود. |
|
table |
عنصر را مانند عنصر جدول در نظر می گیرد. |
|
table-caption |
عناصر را مانند عنصر <caption> در نظر می گیرد. |
|
table-column-group |
عناصر را مانند <colgroup> در نظر می گیرد. |
|
table-header-group |
عناصر را مانند عنصر <thead> در نظر می گیرد. |
|
table-footer-group |
عناصر را مانند عنصر <tfoot> در نظر می گیرد. |
|
table-row-group |
عناصر را مانند عنصر <tbody> در نظر می گیرد. |
|
table-cell |
عناصر را مانند <td> در نظر می گیرد. |
|
table-column |
عناصر را مانند عنصر <col> در نظر می گیرد. |
|
table-row |
عناصر را مانند عنصر ردیف جدول <tr> در نظر می گیرد. |
|
none |
عنصر در هر صورت نشان داده نمی شود. |
نمایش دادن » |
inherit |
مقدار خصوصیت display از عنصر والدش ارث بری می کند. |
بیاموزهای مرتبط
CSS Display (بیاموز CSS)
مثال - خودتان امتحان کنید
Using the inherit value
این مثال نحوه ی استفاده از مقدار inherit را نشان می دهد.
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 11107