如何将CSS属性设置为特定元素的默认值(或防止继承) [英] How to set CSS attributes to default values for a specific element (or prevent inheritance)

问题描述

给出任何HTML元素，该元素是另一个元素的子元素，并且会自动继承一系列CSS属性:如何将这些属性中的一个(或全部)设置为默认值?

Given any HTML element that is a child of another element and is automatically inheriting a series of CSS attributes: how can you set one (or all) of those attributes to the default value?

示例:

CSS:

.navigation input {
    padding: 0;
    margin: 0 30em;
}

HTML

<div class="navigation">
    Some text: <input type="text" name="one" />
    More text: <input type="text" name="two" />
    <!-- The next input, I want it to be as browser-default -->
    <div class="child">
        <input type="text" name="three">
    </div>
</div>

在这里，通过浏览器默认值，我的意思是我希望它看起来就像完全没有CSS应用于该元素一样.

Here, by browser-default I mean I want it to look exactly as if no CSS at all was applied to that element.

在这里，我以input元素为例，但我在谈论的是任何类型的元素.我不是在问如何为该特定元素设置不同的CSS属性，而是在问如何将其重置为其默认值.

Here I'm using an input element as an example, but I'm talking about any kind of element. I'm not asking how to set different CSS attributes to that specific element, I'm asking how to reset it to its defaults.

未设置时，不同的元素具有不同的默认属性，例如padding.例如，在CSS中填充为0的button将包装其文本而没有任何空格.您以后可以将其填充设置为另一个值，但是如何将其设置为默认填充?

Different elements have different default attributes like padding when they are not set. For example, a button that has a padding of 0 in CSS will wrap its text without any space. You can later set its padding to another value, but how would you set it to the default padding?

提前感谢您的任何评论！

Thanks in advance for any comments!

推荐答案

如果您说的是浏览器的默认设置，而不是CSS重置样式表，那么这些样式表遍及整个网络，这些样式表会将每个元素的属性重置为标准化值.

If you are saying about the browser defaults than look at CSS reset stylesheets, they are all over the web, those stylesheets reset each elements properties to a standardized value.

几个例子

Meyer网站

HTML5 Doctor (包括具有HTML5元素的CSS重置)

HTML5 Doctor (CSS Reset With HTML5 Elements Included)

如果您要说手动重置样式并忽略继承，那么直到现在，除非您重新声明样式的值，否则无法完全重置样式.

If you are saying manual style resets and ignore inheritance, than until now, there's no way to reset the styles completely unless and until you re-declare their values so for example

div {
   color: red;
   font-family: Arial;
}

div p {
   /* Here it will inherit the parents child unless and 
      until you re specify properties with different values */
}

这篇关于如何将CSS属性设置为特定元素的默认值(或防止继承)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！