如何在跨度中更改跨度的css？

Question

我希望第4条有一个字体系列而新闻有另一个字体系列。我怎么能做到这一点？当我把字体系列放在第一个和第二个继承它时。

<span><span class="useWord-first">News</span> Article 4</span>

Answer 1

你可以尝试

span {
  color: #000000;
  font-family: sans-serif;
  font-size:18px;
}
span > span.useWord-first {
  color: #000000;
  font-family: arial;
  font-size:18px;
}

Answer 2

在父span元素上设置CSS，然后使用更具体的选择器覆盖该CSS，以设置嵌套.useWord-first元素的样式。

例如：

span {
  color: #f00;
  font-family: monospace;
}
span > .useWord-first {
  color: #00f;
  font-family: arial;
}

<span><span class="useWord-first">News</span> Article 4</span>

Answer 3

您可以使用子代选择器和子类的类别尽可能具体：

span {
  font-family: sans-serif;
}
span > span.useWord-first {
  font-family: Arial;
}

小提琴：https://jsfiddle.net/fa46pzbx/1/