整个（完全）覆盖CSS样式 [英] Entire (completely) overwrite CSS styles

问题描述

如何为类，id或其他CSS选择器覆盖整个CSS样式？

例如：

$ b

如果在 styles1.css中我有：

  / *此外，该文件包含很多其他页面使用的样式* / 
 
 .one-great-class {
 background：white 
 ... 
 / *大量财产* / 
} 
  

...并在 styles2.css （仅用于一个网页）我想覆盖类一个伟大的类 完全

我可以写什么？

  .one-great-class {
 / *是可能的一行代码从这个类中删除所有样式？ * / 
} 
  

解决方案

CSS目前。

但是最终可能会有一个属性这样做： all

它可以取三个值：

初始 | 继承 | unset

取自级联和继承模块：

例如，如果作者指定all：initial on一个元素它会阻止所有的继承并重置所有的属性，就好像没有规则出现在级联的作者，用户或用户代理级别。

<根据2017年6月的 MDN文档， Chrome，Firefox / Mobile和Opera目前支持全部。 Safari只支持其他浏览器不支持的CSS4值 revert ，

  .one-great-class {
 border-radius：50％35％/ 20％25％60％; 
颜色：红色; 
字体：12px / 14px Arial，serif; 
身高：20em; 
 width：20em; 
 / * ...等* / 
} 
 
 .one-great-class {
 all：initial; 
} 
  

How can I overwrite an entire CSS style for a class, id or other CSS selector?

For example:

If in styles1.css I have:

/* also, this file contains a lot of styles used on other pages */

.one-great-class {
    background: white
    ...
    /* a lot of properties */
}

... and in styles2.css (that is used only in one web page) I want to overwrite the class one-great-class completely what have I do to write?

.one-great-class {
    /* Is possible that a line of code to delete all styles from this class? */
}

解决方案

It's not possible in CSS at the moment.

But there may eventually be a property that does this: all

It can take three values:

initial | inherited | unset

Taken from the Cascading and Inheritance Module:

"For example, if an author specifies all: initial on an element it will block all inheritance and reset all properties, as if no rules appeared in the author, user, or user-agent levels of the cascade. "

According to the MDN documentation as of June 2017, all is currently supported by Chrome, Firefox/Mobile, and Opera. Safari supports only the CSS4 value revert, which is not supported by the other browsers.

  .one-great-class {
      border-radius: 50% 35% / 20% 25% 60%;
      color: red;
      font: 12px/14px Arial, serif;
      height: 20em;
      width: 20em;
    /*... etc. */
  }

  .one-great-class {
      all: initial;
  }

这篇关于整个（完全）覆盖CSS样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！