Html 如何内联删除 CSS 元素样式（没有 JavaScript）？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2148115/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I remove CSS element style inline (without JavaScript)?
提问by simon
I have a style assigned for a specific HTML element in my stylesheet file, like this
我为样式表文件中的特定 HTML 元素分配了一个样式，如下所示
label {
width: 200px;
color: red;
}
In one special case, I would like to use a label element in the HTML document, but ignore the style specified for the label element (just for one instance in the document). Is there any way to achieve this in a generic way without overriding the element style attributes with inline styles?
在一种特殊情况下，我想在 HTML 文档中使用 label 元素，但忽略为 label 元素指定的样式（仅针对文档中的一个实例）。有没有办法以通用方式实现这一点，而无需使用内联样式覆盖元素样式属性？
<label for="status">Open</label>
To reiterate, to the HTML code displaying the label the element style (width 200 px, color red) is applied. I would like the default style attributes to be used (without knowing what they are) and without having to know what is specifically specified in the element style setting.
重申一下，对显示标签的 HTML 代码应用了元素样式（宽度为 200 像素，颜色为红色）。我希望使用默认的样式属性（不知道它们是什么）并且不需要知道元素样式设置中具体指定的内容。
回答by ЯegDwight
From the Mozilla developer center:
Because CSS does not provide a "default" keyword, the only way to restore the default value of a property is to explicitly re-declare that property.
Thus, particular care should be taken when writing style rules using selectors (e.g., selectors by tag name, such as p) that you may want to override with more specific rules (such as those using id or class selectors), because the original default value cannot be automatically restored.
Because of the cascading nature of CSS, it is good practice to define style rules as specifically as possible to prevent styling elements that were not intended to be styled.
因为 CSS 不提供“默认”关键字，所以恢复属性默认值的唯一方法是显式重新声明该属性。
因此，在使用选择器（例如，按标签名称的选择器，例如 p）编写样式规则时应特别小心，您可能希望用更具体的规则（例如使用 id 或类选择器的那些）覆盖，因为原始默认值不能自动恢复。
由于 CSS 的级联特性，最好尽可能具体地定义样式规则，以防止样式化元素不打算设置样式。
回答by Sophie88
<label ... style = "width: auto; color: inherit" />
回答by prodigitalson
<label ... class="default">...</label>
label {
width: 200px;
color: red;
}
label.default {
width: auto;
color: inherit;
}
however that may not provide the desired results - the other way would be to give all the other labels a particluar class(es) and then not assign that class to the "default" label.
但是，这可能无法提供所需的结果 - 另一种方法是为所有其他标签提供一个特定的类，然后不将该类分配给“默认”标签。
回答by simon
The situation has somewhat changed in 6 years: now it is possible to remove a set CSS property without using JavaScript by using the initial, unsetor revertkeywords. These are supported in all modern browsers.
情况在 6 年中发生了一些变化：现在可以使用initial、unset或revert关键字在不使用 JavaScript 的情况下删除设置的 CSS 属性。所有现代浏览器都支持这些。
回答by Tom
I don't think you can reset it to what it was before the label definition in the stylesheet, but you could give the label an id and override it in your stylesheet.
我认为您不能将其重置为样式表中标签定义之前的状态，但您可以为标签指定一个 id 并在样式表中覆盖它。
<label for="status" id="status-label">Open</label>
label {
width: 200px;
color: red;
}
label#status-label {
width: auto;
color: blue;
}
回答by user193130
You can use the :not selector:
您可以使用:not 选择器：
label:not([for="status"]) {
width: 200px;
color: red;
}
Support seems to date back to around 2009 (FF3.5)
支持似乎可以追溯到 2009 年左右（FF3.5）
