A line-clamp tulajdonság

A left tulajdonság a szöveget a megadott sorok számára korlátozza. A felesleges sorok helyett három pont kerül a szövegbe.

Szintaxis

cssszelektor {
  line-clamp: none | sorok száma
}

Példa

Korlátozzuk a szövegünket két sorra:

html<p>
  szöveg szöveg szöveg szöveg szöveg szöveg szöveg szöveg
  szöveg szöveg szöveg szöveg szöveg szöveg szöveg szöveg
  szöveg szöveg szöveg szöveg szöveg szöveg szöveg szöveg
  szöveg szöveg szöveg szöveg szöveg szöveg szöveg szöveg
</p>

cssbody {
  width: 200px;
  height: 100px;
}
p {
  -webkit-line-clamp: 2;
  line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

Результат: