Селектор CSS для предложений после первого предложения
У меня вопрос о селекторе css. Я хочу выбрать все предложения после первого предложения в контейнере. Для первого предложения нет проблем:
:first-line
Но я не могу найти способ выбрать предложения "после первой строки". Я пробовал что-то подобное, но он не работает.
:not(:first-line)
Вот скрипка с выбранным первым предложением, но это не решает мою проблему. http://jsfiddle.net/zono/2bDx8/С уважением.
Прежде всего, ::first-line
не выбирает первое sentence
, оно выбирает первую line
, конец которой отмечен разрывом строки. Тем не менее, я не думаю, что есть один селектор за то, что вы требуете, но здесь аккуратный трюк:
.linesOfText { /* :not(:first-line)) */
background-color: blue;
}
.linesOfText::first-line{
background:white;
}
Фокус в том, что высота каждой строки по умолчанию равна 1em. Установка скрытой максимальной высоты и переполнения отображает только первую строку предложения.
p {
max-height: 1em;
overflow: hidden;
}
Другой подход может заключаться в использовании переполнения текста: эллипсис. Это намного удобнее, поскольку это указывает на то, что предложение имеет больше текста и обрезается.
http://jsfiddle.net/Wws6L/11/
p {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
- Вопросы
- Css-selectors
- Селектор CSS для предложений после первого предложения