Günümüzde daha da güçlenmiş olarak var olan CSS3 ile yapabileceklerimizi daha fazla şekillendirebiliriz. CSS3 tarayıcı tarafından okunduğu için açılış olarak sunucunuzdan bir geri dönüş beklemeden yayınlanacaktır. Bu işlemi php, .net vb. programlama dili kullanarak yaptığınızda yazdığınız kodun çözümlenmesi için sunucu ile işlem gerçekleşecektir.
Biz bu yazımızda içerik bulunan alanlarda kullanılmak üzere CSS ile sorunumuzu çözümleyeceğiz.
Bir HTML element içerisindeki metinlerin beyaz boşluklarının nasıl görüneceğini CSS white-space özelliği ile ayarlıyoruz.
white-space özelliğinin aldığı değerler:
normal (varsayılan)
nowrap
pre
pre-wrap
pre-line
CSS overflow özelliği değerleri
Visible :Varsayılan değer. İçerik kırpılmamış;
hidden :Eleman kutusundan taşan içerik kırpılır ve içeriğin geri kalan kısmı görünmez olur.
scroll :Taşan içerik tıpkı gizli gibi kırpılır, ancak taşan içeriğe erişmek için kaydırma mekanizması sağlar.
auto :İçerik divin kutusundan taşıyorsa, içeriği geri kalanını görmek için kaydırma çubuklarını otomatik olarak sağlar, aksi takdirde kaydırma çubuğu görünmez.
initial :Özelliğin varsayılan değeridir.
inherit :Bu özellik, üst öğeden devralır.
text-overflow özelliği değerleri
Varsayılan değeri clip’dir. Clip değeri alan satır içi eleman kapsayıcı eleman sınırlarından kesilecektir. İkinci aldığı değer ellipsis’dir. ellipsis değeri alan eleman clip gibi davranacaktır ancak farklı olarak sonuna üç nokta(…) koyacaktır
Yukarıda ki bilgiler doğrultusunda HTML tag’ı olan H başlıklarımıza veya div id, classlarımıza vermemiz gereken kod bloğu aşağıda ki gibi olacaktır.
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
Yazının kaynağı : http://sercansevincer.com.tr/css-ile-basliklarin-veya-yazilarin-sonuna-uc-nokta-koyma/
