Question

我很抱歉，如果这个问题看起来不知情并且缺乏自己的研究，但我已经尝试搜索任何我能想到的谷歌，但仍然找不到任何关于它的东西。

前段时间，我回想一下有关相对于它们声明的样式表的样式的一些内容。我不完全确定这是否确实是我读到的页面上的意思，但我不知道我在哪里读到它，所以我不知道在哪里查看它。无论如何，这是我从中得到的印象：

我正在寻找的是一种方法，只需选择div中也包含样式标记的span。

<div>
    <span class="special">Not red</span>
</div>
<div>
    <style>.special {color:red;}</style>
    <span class="special">Red</span>
</div>

我知道这不起作用，但我不知道如何做到这一点，或者甚至可以在主体中插入样式标签，然后相对于该样式标签应用样式。

如果有人知道如何做到这一点（没有JavaScript），或者你绝对相信如果没有为受影响的范围分配单独的课程是不可能的，请告诉我。

PS：元素出现的顺序可能不同，因此div + div .special {color:red;}或div:last-child .special {color:red;}将无效。

Answer 1

普通CSS可以将不同的类应用于这些跨度。它们根本不同。

如果你想解决这个问题，你可以将类应用到它们的封闭div：

<div>
    <span class="special">Not red</span>
</div>
<div class="div-special">
    <span class="special">Red</span>
</div

CSS：

.div-special .special { color: red; }

编辑您可以在第二个范围内添加第二个类并在其中应用颜色<span class="special colored-red">

Answer 2

我相信你正在寻找<style scoped>

以下是一些链接

因此，您的示例中几乎可以正确使用它，只需添加scoped属性即可。