css类选择器，用于选择div中的文本

Question

我有一个带有类名“test”的div。 类“test”有一个光标指针分配给它。 该类还具有200px的固定宽度。 div内部的文本长度短于div的宽度。 当鼠标放在div的空白部分时，我不希望出现该点。

有没有办法我可以将css指针分配给div内的文本，而不将文本包装在另一个<span>标记内。 我只是不想回去并将span标记添加到每个div并重写javascript。

我在想像这个伪css代码

.test.text {
  cursor:pointer;
}

Answer 1

CSS无法以这种方式工作。 正如biziclop在评论中所说， 无法使用CSS选择文本节点 。 您必须将文本包装在<span>并使用

.test span {
    cursor: pointer;
}

同

<div class="test">
    <span>Text</span>
</div>

或者设置.test来display: inline ，但这不会让你给它一个宽度，这不是你想要的行为。 在这种情况下， <span> s很好。

Answer 2

您可以尝试使用:before或:after伪元素。

对于1行div，我正在使用这个解决方案：
http://jsfiddle.net/yAfKw/

多行div：
http://jsfiddle.net/yAfKw/1/

适用于Firefox，在Safari中不起作用。