避免工作表中的样式仅适用于一个元素

Question

我有一个样式表，其中包含影响我页面中两个元素的样式，我无法更改元素的类，有没有办法确保样式只适用于我的页面中的一个特定元素而不是为了另一个。

Answer 1

您是否尝试过第一个类型选择器？

离。

p:first-of-type {
  background:#ff0000;
}

Answer 2

是。你可以通过特异性来做到这一点。

选择最顶级的父母并继续定位他们的孩子，直到您到达应用样式所需的最后一个子元素。

如果你可以为它添加一个id或者动态生成任何id，只需为它创建一个特异性，你就可以完成任务。

对于实例，

body div#your id name div.your_class1 > div.your_class_element_that_you_want_to_style{/* your values */}

希望这有帮助。

PS：在插图中，div用作参考，您可以根据HTML结构选择元素。

Answer 3

如果有两个，则使用:first-of-type选择器：

div.selector:first-of-type {
    /* styles here */
}