第一句后句子的CSS选择器

Question

我对css选择器有疑问。我想在第一句话之后选择所有句子 在容器中。对于第一句话没有问题：

 :first-line

但我无法在第一行＆＃34;之后找到选择句子的方法。我试过这样的事情但是 它没有工作。

:not(:first-line)

这是选择第一句的小提琴，但这不能解决我的问题。 http://jsfiddle.net/zono/2bDx8/ 最好的祝福。

Answer 1

首先，::first-line未选择第一个sentence，它会选择第一个line，其结尾以换行符标记。也就是说，我认为没有一个选择器可以满足您的需求，但这里有一个巧妙的诀窍：

.linesOfText {       /* :not(:first-line)) */
   background-color: blue;
}

.linesOfText::first-line{
    background:white;
}

<强> DEMO

Answer 2

诀窍是每行的高度默认为1em。设置最大高度和隐藏溢出只会显示句子的第一个行。

http://jsfiddle.net/AqaLJ/2/

p  {
 max-height: 1em;
 overflow: hidden;
}

另一种方法可能是使用文本溢出：省略号。这更加用户友好，因为它表明句子有更多的文字并且被修剪 http://jsfiddle.net/Wws6L/11/

p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}