如何删除内联的CSS元素样式(不使用JavaScript)?

sim*_*mon 13 html css inheritance overriding

我在样式表文件中为特定的HTML元素指定了样式,如下所示


label {
  width: 200px;
  color: red; 
}
Run Code Online (Sandbox Code Playgroud)

在一个特例中,我想在HTML文档中使用label元素,但忽略为label元素指定的样式(仅适用于文档中的一个实例).有没有办法以通用的方式实现这一点而不用内联样式覆盖元素样式属性


<label for="status">Open</label>
Run Code Online (Sandbox Code Playgroud)

重申一下,对于显示标签的HTML代码,应用了元素样式(宽度为200像素,红色).我希望使用默认样式属性(不知道它们是什么),而不必知道元素样式设置中具体指定的内容.

Яeg*_*ght 17

来自Mozilla开发人员中心:

由于CSS不提供"default"关键字,因此恢复属性默认值的唯一方法是显式重新声明该属性.

因此,在使用选择器(例如,按标签名称的选择器,例如p)编写样式规则时,应特别注意您可能希望使用更具体的规则(例如使用id或类选择器的规则)覆盖它们,因为原始默认值值无法自动恢复.

由于CSS的级联性质,最好尽可能具体地定义样式规则,以防止不打算设置样式的样式元素.


Sop*_*e88 6

  <label ... style = "width: auto; color: inherit" />
Run Code Online (Sandbox Code Playgroud)