技术频道


CSS 选择器,选择 DIV 里的内容而不选择某个标签

注意下面先是一个错误示例

div:not(i) {
  /* 这里放置你的样式规则 */
}

但是,:not() 伪类不能直接用于元素类型,所以上面的选择器是不正确的。

正确的做法是使用后代选择器来选择 <div> 中的所有元素,然后排除 <i> 标签。以下是正确的CSS选择器:

div *:not(i) {
  /* 这里放置你的样式规则 */
}

这个选择器会选择 <div> 中的所有元素,但排除 <i> 标签。如果你想要直接选择 <div> 中的文本节点,而不是元素,可以使用以下选择器:

div:not(:empty):not(i) {
  /* 这里放置你的样式规则 */
}

这个选择器会选择所有非空的 <div> 元素,但不会选择 <i> 元素。不过,CSS 没有直接选择文本节点的选择器,所以这种方法可能不会完全按照你的预期工作。如果你想要更精确地控制样式,可能需要结合 HTML 结构和 JavaScript 来实现。

CSS 选择器扩展阅读:




发表评论