Css İle Uzun Kelimelerin Sonuna 3 Nokta Koymak

Css İle Uzun Kelimelerin Sonuna 3 Nokta Koymak

- in Css Tasarım ve Dersler
3214
2

Css 3’ün gelmesi ile birlikte bir çok alanda kolaylık yaşandı. Bunlardan bir tanesi de uzun cümlelerin belirli yerden kesilip devamına 3 nokta koyulması.

 

Daha önceleri çok da pratik olmayan şekillerde uzun cümleleri asp veya php gibi web programlama dilleri ile gerekli yerlerinden kesilmekteydi. Şimdi Css 3 ile cümlelerimizi kesmeden gerekli yerde cümleyi durdurup, cümlenin devamına 3 nokta koyabiliyoruz.

 

Örnek Css Kodu:

 

Açıklama: Maximum genişliği 200 px olan bir css sınıfı oluşturduk. Ve oluşturduğumuz sınıfta ki fazla metni kesip yerine 3 nokta koyması için text-overflow: ellipsis; kodunu kullandık.

 

Dikkat edilmesi gereken nokta: overflow:hidden; white-space:nowrap; text-overflow: ellipsis; kodlarınmızın sınıfımızda bulunmasıdır. Bu şekilde oluşturduğumuz sınıfın dışına çıkan metinler otomatik olarak kesilir ve kesildiği yere 3 nokta eklenir.



2 Comments

  1. çok güzel özellik teşekkürler.

  2. PHP ile nasıl yapılır diye ararken bu yazınıza denk geldim ve çok işime yaradı. Çok teşekkür ediyorum.

Leave a Reply

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir