3

Добрый день, не до конца понял свойство

 text-overflow: ellipsis; 
оно работает только для текста в одну линию в паре со свойством
white-space: nowrap;
нужно сделать эффект обрезания текста красиво, градиент не подойдет может кто знает это сделать с эффектом многоточия?

2

1 ответ 1

1

.text {
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100px;
  overflow: hidden;
 }
<div class="text">text text text text text text text text text</div>

источник

4
  • Вот я об этом и спрашивал, можно сделать то же самое только для нескольких строк текста, скажем в блок помещается 3 строки и последняя заканчивается многоточием? 3 сен 2016 в 10:31
  • 1
    Ну если только применить JavaScript
    – Amandi
    3 сен 2016 в 10:37
  • 1
    @Constantine Shibaev, свойство ellipsis работает только для одной строки текста. Средствами css подобное обрезание текста из нескольких строк не сделать
    – user31906
    4 сен 2016 в 20:05
  • @mJeevas Я нашел способ сделать это для нескольких строк, правда это работает только для хрома вот таким куском кода display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; 4 сен 2016 в 20:23

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.