Bu özellik bir elemanı oluşturan kutu tipini belirler.
HTML elemanlarını başlangıçta blok seviyeli ve satır içi seviyeli olarak tanımlıdır. Ancak bu elemanların başlangıç değerlerini display özelliği ile değiştirebiliriz. Yani bir satır içi seviyedeki elemanı örneğin bir linki (<a>….</a>) blok seviyeden bir elemana dönüştürebiliriz. Aynı şekilde bir blok seviyedeki elemanı satır içi seviyeden bir elemana dönüştürebiliriz.
Yapısı: display: <değer>
Aldığı Değerler: none | inline | block | inline-block | list-item | run-in| table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | inherit | marker
block: Bu değer bir elemanın bir blok kutusu üretmek için kullanılır.
inline: Bu değer bir elemanın bir veya daha fazla sayıda satır içi kutu üretmek için kullanılır.
list-item: Bu değer bir elemanın (HTML'deki <li> gibi) bir blok kutu ve bir liste öğesi satır içi kutusu üretmek için kullanılır.
none: Bu değer bir elemanın biçimleme yapısında hiçbir kutu
üretmemesine sebep olur (yani, elemanın yerleşime hiçbir etkisi olmaz; başka bir ifade ile, gösterilmez). Ayrıca alt elemanlar da görünmez ve bu davranış alt elemanların display nitelikleriyle etkisiz kılamaz.
table, inline-table, table-row-group, table-column, table-columngroup, table-header-group, table-footer-group, table-row, tablecell ve table-caption:
Bu değerler bir elemanın bir tablo elemanı gibi davranmasına sebep olur. run-in, inline-block, ve inline-table özelliklerini tüm tarayıcılar desteklememektedir.
Örnek
Display niteliği örnekleri:
p {
display: inline;
}
em {
display: block;
}
p { display: block }
em { display: inline }
li { display: list-item }
img { display: none } /* resimler gösterilmez */
Hiç yorum yok:
Yorum Gönder