是否有可能使CSS类相互扩展？

Question

我有一些CSS类：

  .span9 {
    width: 870px;
  }
  .span4 {
    width: 370px;
  }

在另一个自定义CSS文件中，我想创建另一个CSS类.span9？我该怎么做？

原因是因为DOM元素使用.span4而我想覆盖它，但必须在自定义外部CSS文件中覆盖它。

这可能吗？

Answer 1

是的，CSS是级联（样式表），所以只需在初始样式之后加载更改，它就会按你的需要工作。如果你想覆盖宽度只需重新声明，如果你想添加样式，则简单声明它们。

Answer 2

您可以使用！important功能覆盖其他文件中的任何设置，因此在新文件中您可以执行以下操作：

.span9 {
  width: 800px !important;
}

Answer 3

如果你有不同的.span父母，你可以这样做：

<强> HTML

<div id="parent">
   <span class="span9"> Hello world!</span>
</div>

<强> CSS

.span9{width:870px;}
#parent .span9{width:100px;}

或者你直接使用HTML（但这不​​是一个非常好的方法）

<span class="span9" style="width:100px!important;"> Hello world</span>

Answer 4

是的，只需使用!important即可。这将覆盖其后的其他CSS规则，除非它们也标记为!important。

所以你的第二个样式表可能包含类似

的内容

.span9 {
    width: 1020px !important;
  }

这就是CSS默认的内容。您可以使用它来覆盖CMS等中的内置样式表，而不必弄乱它们的实际样式表。

Answer 5

您可以通过标记名称和类名的连接来覆盖它。例如，这样：div.span4将覆盖简单的.span4，看看：http://jsfiddle.net/5dYHG/1/