مثال (خصوصیت 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 را نشان می دهد.