代码之家 › 专栏 › 技术社区 › webmaster pf

从样式设置中排除子项:not

css-selectors sass css

webmaster pf · 技术社区 · 7 年前

我尝试使用以下HTML标记为内容的一部分应用样式:

<li class="views-row views-row-9 views-row-odd tid-106
">  
<span><a href="/fiche/bac-pro-csr">BAC Pro Commercialisation et services en restauration - CSR</a>
<br><span class="complement">
 Bac Pro CSR avec Restaurant d'application (Section EuropÃ©enne)
  </span><br> 
Section EuropÃ©enne 
</span>
  </li>

我只想要一个样式为“Section EuropÃ©enne”的文本,并从span中排除内容。补充,所以我尝试在sass中不起作用的方法:

 li{
                  &:not(img):not(a):not(.complement){
                        font-weight: bold;
                        /*-webkit-text-stroke:em(1px) $gris-anthracite;//Contour de texte*/
                    }
                    &:matches(.complement){
                        font-weight: initial;
                    }}

有可能做到这一点吗? 是否可以通过:not排除span via的span子级?

像这样的?

              &:not(img):not(a):not(>span.complement){}

谢谢

1 回复 | 直到 7 年前

Temani Afif 7 年前

您需要这样做,因为跨度在另一个跨度内:

li span {
  font-weight:bold;
}
li span.complement {
  font-weight:initial; /*we revert back the inherited style*/
}

<li class="views-row views-row-9 views-row-odd tid-106">
  <span><a href="/fiche/bac-pro-csr">BAC Pro Commercialisation et services en restauration - CSR</a>
<br>
<span class="complement">
 Bac Pro CSR avec Restaurant d'application (Section EuropÃ©enne)
 </span>
 <br> Section EuropÃ©enne
  </span>
</li>

推荐文章

delves · Sass不识别变量

2 年前

Nathan Huber · 如何在React 18中使用“useEffect”

3 年前

Janosz ÐÑÐ°ÑÐ¸ÑÐ½Ð¸Ðº · 如何瞄准这个i标签

3 年前

Henry · scss或css中的calc函数不起作用

3 年前

Nam Van · 如何在React中使用自定义主题颜色。js,CSS(SCSS)模块,Bootstrap5

3 年前

rook99 · 无法加载图标的字体

6 年前

Glen Elkins · SASS新手-不编译

6 年前

Toki · SASS在Sublime Text-Compile main中。保存任何@导入文件时的scss

6 年前

zed · 防止SCS编译CSS变量-Angular CLI

6 年前

sliptype · 使用Webpack提取CSS时抑制模块输出

6 年前