选择器只是div的文本？

Question

当用户将鼠标悬停在我的文本div而不是div自身的文本上时,我试图让光标发生变化.我目前有:

div {
  width: 500px;
  height: 500px;
  background-color: green;
}
div:hover {
  cursor: pointer
}

<div>
  Hello
</div>

有没有办法让我以某种方式选择diva的文本并对文本本身应用悬停效果.

Answer 1

由于您无法在CSS中选择文本节点,因此必须将其包装以便选择它.

div {
  width: 500px;
  height: 500px;
  background-color: green;
}
div span:hover {
  cursor: pointer;
}

<div>
  <span>Hello</span>
</div>

但是,如果您想要解决方法,可以通过伪元素添加文本,如下所示:

div {
  width: 500px;
  height: 500px;
  background-color: green;
}
div:after {
  content: 'Hello';
  cursor: pointer;
}

<div></div>