html - 为除一个类之外的所有元素创建一个 CSS 规则？

Question

我有一个像这样的html:

<div class="portfolio-descr">
    <span class="posted-in"></span>                             
    <h3><a href="">Name</a></h3>           
    Some text <!-- HIDE THIS -->
</div>

我想隐藏Some text但不是<h3>标签，纯粹使用 CSS，如下所示:

.portfolio-descr:not(h3) {
  display:none;
}

但是所有元素都被隐藏了。

Answer 1

如果您使用显示属性，它将影响父级及其子级，但您可以使用可见性属性来实现您的目标。 (我在 .posted-in span 中添加了一些文本以更好地显示结果)

.portfolio-descr{
  visibility:hidden;
}

.portfolio-descr>*{
  visibility:visible;
}

<div class="portfolio-descr">
        <span class="posted-in">abc</span>                             
        <h3><a href="">Name</a></h3>           
        Some text
</div>