有没有办法告诉html元素忽略任何样式表？

Question

我正在尝试将下拉列表添加到已具有全局"选择"样式的页面.有没有办法告诉新的选择列表忽略全局风格？使用全局样式的大约有1到2亿个现有的下拉,所以我不想重构现有的html.

Answer 1

假设您可以在该元素上设置唯一的类或ID,您可以使用(有限的浏览器支持)属性all并将其设置为unset或initial

就像是

<div class="ignore-css"><div>

和

.ignore-css{all:unset;}

Answer 2

没有简单的方法可以做你想要的,一种方法是创建一个CSS类,重置特定元素及其子元素的所有适当属性,使其更完整,这里是一个很好的起点元素特定的CSS重置

Answer 3

您可以使用"!important"覆盖另一个样式,如下所示:

a {color: red !important}

或使用更具体的选择器:

*               // a=0 b=0 c=0 -> specificity =   0 
LI              // a=0 b=0 c=1 -> specificity =   1 
UL LI           // a=0 b=0 c=2 -> specificity =   2 
UL OL+LI        // a=0 b=0 c=3 -> specificity =   3 
H1 + *[REL=up]  // a=0 b=1 c=1 -> specificity =  11 
UL OL LI.red    // a=0 b=1 c=3 -> specificity =  13 
LI.red.level    // a=0 b=2 c=1 -> specificity =  21 
#x34y           // a=1 b=0 c=0 -> specificity = 100 
#s12:not(FOO)   // a=1 b=0 c=1 -> specificity = 101

见特异性文档这里.

更新:

例如:

你有一个全球规则:

a {color: blue}

但是你希望你的链接变红.因此,您必须创建以下规则:

a {color: red !important}

如果全局规则也有"!important",则必须使用更具体的选择器:因此,您可以使用:

body a {color: red !important}