صفت display مهمترین صفت در CSS برای كنترل قالب بندی می باشد.
برای تعیین نمایش یا عدم نمایش عناصر از صفت display استفاده می كنیم. هر عنصری با توجه به نوع آن یك مقدار پیش فرض برای نمایش دارد. مقدار پیش فرض صفت display برای بسیاری از عناصر block یا inline می باشد.

عناصر سطح بلوك

یك عنصر سطح بلوك همیشه از سر سطر شروع شده و به اندازه كل عرض موجود طول ادامه می یابد.


مثال هایی از عناصر سطح بلوك :

<div>
<h1> - <h6>
<p>
<form>
<header>
<footer>
<section>

عناصر داخل خط (inline)

یك عنصر داخل خط از خط جدیدی شروع نمی شود و تا جایی كه لازم باشد عرض می گیرد.


مثال هایی از عناصر داخل خطی :

<span>
<a>
<img>

;display:none

صفت و مقدار ;display:none معمولا به همراه جاوا اسكریپت برای مخفی كردن و نمایش عناصر بدون حذف یا دوباره سازی آنها ،‌استفاده می شود. برای عنصر <script> مقدار پیش فرض ;display:none است.

تغییر مقدار پیش فرض display

همانطور كه اشاره شد ،‌ صفت display مقدار پیش فرضی دارد. اما می توان آن را تغییر داد. تبدیل یك عنصر داخل خطی به عنصر سطح بلوك یا برعكس می تواند روشی برای خاص نشان دادن صفحه وب باشد، كه البته در هر حال از استانداردهای وب خارج نخواهد شد.

مثال زیر نشان دهنده تبدیل عنصر داخل خطی <li> به یك منوی افقی است.

مثال :

li {
    display: inline;
}

span {
    display: block;
}

a {
    display: block;
}

مخفی كردن عناصر

با تنظیم صفت display بر روی none میتوان یك عنصر را مخفی كرد. عنصر مخفی خواهد شد و صفحه به گونه نمایش داده می شود كه آن عنصر وجود ندارد.

مثال :

h1.hidden {
    display: none;
}

h1.hidden {
    visibility: hidden;
}