column-count Özelliği
column-count özelliği, çok sütunlu metindeki tavsiye edilen
sütun sayısını belirler.
Gerçek sütun sayısı, sütun genişliği ve
aralarındaki boşluğun boyutuna bağlı olarak
belirtilenden farklı olabilir.
Sözdizimi
seçici {
column-count: sayı | auto;
}
Değerler
| Değer | Açıklama |
|---|---|
| sayı | Belirtilen sayıda sütun tanımlar. Daha doğrusu, tarayıcıya bu sayıda sütun kullanmasını tavsiye eder, çünkü gerçek sütun sayısı sütun genişliği ve aralarındaki boşluğun boyutuna bağlı olarak belirtilenden farklı olabilir. |
auto |
Tarayıcı en uygun sütun sayısını kendisi belirler. |
Varsayılan değer: auto.
Örnek
Bu örnekte metin 3 sütuna bölünecektir
(tabi ki çok sütunluluğu destekleyen tarayıcılarda,
diğerlerinde tek sütunlu normal metin görünecektir):
<div id="elem">
some long text
</div>
#elem {
column-count: 3;
text-align: justify;
}
:
Örnek . Auto değeri
Bu örnekte sütun genişliği column-width
olarak 150px belirtilmiş ve sütun sayısı column-count
auto değerine ayarlanmıştır - tarayıcı gerekli
sütun sayısını ve aralarındaki boşluğu kendisi
belirleyecektir:
<div id="elem">
some long text
</div>
#elem {
column-count: auto;
column-width: 150px;
text-align: justify;
}
:
Ayrıca bakınız
-
sütun genişliğini belirleyen
column-widthözelliği,
-
sütunlar arası boşluğu belirleyen
column-gapözelliği,
-
sütunlar arası sınırı belirleyen
column-ruleözelliği,
-
Bir öğenin kaç sütun boyunca uzaması gerektiğini belirleyen
column-spanözelliği,
-
çok sütunluluk için kısayol özellik olan
columnsözelliği