Результат для заголовков
CSS для заголовков
/*Сокращаем количество слов в заголовке*/
.elementor-post__title{
white-space: nowrap; /* Отменяем перенос текста */
overflow: hidden; /* Обрезаем содержимое */
padding: 0; /* Поля */
background: #fff; /* Цвет фона */
position: relative; /* Относительное позиционирование */
}
.elementor-post__title::after {
content: ''; /* Выводим элемент */
position: absolute; /* Абсолютное позиционирование */
right: 0; top: 0; /* Положение элемента */
width: 40px; /* Ширина градиента*/
height: 100%; /* Высота родителя */
/* Градиент */
background: -moz-linear-gradient(left, rgba(255,255,255, 0.2), #fff 100%);
background: -webkit-linear-gradient(left, rgba(255,255,255, 0.2), #fff 100%);
background: -o-linear-gradient(left, rgba(255,255,255, 0.2), #fff 100%);
background: -ms-linear-gradient(left, rgba(255,255,255, 0.2), #fff 100%);
background: linear-gradient(to right, rgba(255,255,255, 0.2), #fff 100%);
}
/*Сокращаем количество слов в заголовке end*/
Результат для строк
CSS для строк
Где clamp укажите сколько строк нужно
/*Сокращаем количество слов в описании*/
.kratkoe {
-ms-text-overflow: ellipsis;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-ms-line-clamp: 2;
-webkit-line-clamp: 2;
line-clamp: 2;
display: -webkit-box;
display: box;
word-wrap: break-word;
-webkit-box-orient: vertical;
box-orient: vertical;
}
/*Сокращаем количество слов в описании end*/