Mikail.Net

Yazılımcı günlüğü

line-clamp

tailwindcss/line-clamp, Tailwind CSS adlı bir CSS framework’ünün bir özelliğidir. Bu özellik, çok satırlı metinleri sınırlı bir alan içinde göstermek için kullanılır.

line-clamp, bir div veya başka bir HTML öğesi içindeki metnin kaç satırda kesileceğini belirler. Bu özellik, özellikle blog yazıları, makaleler ve diğer uzun metinler gibi çok satırlı metinlerin yer aldığı web siteleri için kullanışlıdır.

Örneğin, bir div içindeki metni en fazla üç satıra kısaltmak istiyorsanız, aşağıdaki CSS kodunu kullanabilirsiniz:

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

Bu kod, line-clamp-3 sınıfını kullanarak belirtilen öğenin içindeki metni en fazla üç satıra kısaltır. Bu sayede, çok satırlı metinler daha az alan kaplar ve web sayfasının daha temiz ve düzenli görünmesini sağlar.