Kategoriler
Kodlama

CSS text-overflow: ellipsis; kullanımı

CSS text-overflow: ellipsis; kullanımı hakıında örnekler.

Sayfada bir metnin yatay uzunluğunu kontrol etmek ve bu uzunluğu ilgili elemanın genişliğine göre kesmek için CSS‘de ellipsis özelliğini kullanabiliriz.

Örnek kullanım, bu kod .uzunisekes classına sahip metinleri 250px; genişliğe sığınmadığı taktirde kesip … ile bitirir:

.uzunisekes {
  width: 250px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
Basic Overflow Ellipsis

Farklı şekillerde de kullanılabilir, uzun yıllardır takip edttiğim CSS konusunda uzman bir blog olan css-tricks.com’dan daha fazlasını öğrenebilirsiniz: https://css-tricks.com/snippets/css/truncate-string-with-ellipsis/ ayrıca kaynak: https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow.

İyi çalışmalar 🐱‍👤

wolkanca.com’da CSS text-overflow: ellipsis; kullanımı veya diğer konular hakkında herhangi bir sorunuz varsa, sosyal medya butonları ile yorum ya da mesaj göndermekten çekinmeyin, CSS text-overflow: ellipsis; kullanımı için ya da değil DM kapısı her daim açık. Yazıyı beğendiyseniz paylaşın, daha fazla ilgili gönderi için hemen aşağıdaki menülere göz gezdirebilirsiniz, okuduğunuz için teşekkürler, saygılar sevgiler.

WOLKANCA

Volkan Yılmaz

Digital Marketing & WordPress & SEO - wolkanca mahallesi gmail sokak nokta com.