Свойство line-clamp
Описание
Ограничивает текст заданным числом строк. При превышении текста указанным числом строк, он обрезается и в конце добавляется многоточие.
Синтаксис
line-clamp: none | число;Подробности
| Значение | Описание |
| none | Содержимое никак не ограничивается. |
| число | Содержимое ограничивается указанным числом строк. |
Пример
<!DOCTYPE html>
<html lang='ru'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Document</title>
</head>
<body>
<style>
.text {
background: #0285b532;
padding: 15px;
}
.text p {
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
}
</style>
<div class='text'>
<p>
Далеко-далеко, за словесными горами в стране гласных и согласных живут рыбные тексты. Заглавных рекламных вдали дорогу знаках они меня lorem власти родного рыбными океана, одна ты большой решила, от всех жизни предупреждал оксмокс языкового собрал раз журчит свое, но проектах запятой
? Рукописи жизни безопасную ведущими диких которое толку рыбными текст ее его буквенных.
</p>
</div>
</body>
</html>Читайте также
Стиль первого элемента
Псевдокласс задаёт стиль первого элемента в группе братских элементов (имеющих одного родителя).
Для выбора первого элемента определённого типа...
Свойство right
Для позиционированного элемента определяет расстояние от правого края родительского элемента, не включая отступ, поле и ширину рамки, до правого края ...
Селекторы атрибутов со значениями в конце
Устанавливает стиль для элемента в том случае, если значение атрибута оканчивается указанным текстом....
Стиль первого символа в тексте
Псевдоэлемент ::first-letter определяет стиль первого символа в тексте элемента, к которому добавляется. К этому псевдоэлементу могут применяться толь...