Question

我有一个像这样的HTML：

XmlNodeList dataNodes = xmlDoc.SelectNodes("/ENVELOPE/BODY/IMPORTDATA/REQUESTDATA/TALLYMESSAGE/VOUCHER")

我想要隐藏<div class="portfolio-descr"> <span class="posted-in"></span> <h3><a href="">Name</a></h3> Some text  </div>而不是Some text标记，纯粹使用这样的CSS：

<h3>

但所有元素都被隐藏了。

Answer 1

如果使用display属性，它将同时影响父级及其子级，但您可以使用visibility属性来实现目标。（我在.posted-in span中添加了一些文字以更好地显示结果）

＆＃13;

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

＆＃13;

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

＆＃13;

Answer 2

在父类和后代h3之间放置空格否则h3被视为父类portfolio-descr

的一部分

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

更正HTML：

根据需要将some text放入内联/阻止html元素

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

工作plunker

Answer 3

如果您只想隐藏文本而不隐藏h3和span标签，其中一个选项是使字体颜色和背景相同

检查此代码段

.portfolio-descr:not(h3):not(span) {
  color: white;
  background: white;
}

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

希望有所帮助

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

3 个答案: