8

对于一个项目，我必须使用已定义的样式表。我无法编辑它，我必须接受它。

但是，有些样式不适合本网站（例如边距）。

我也创建了自己的 CSS 文件来覆盖其中的一些属性。

一个例子，如果我有这个：

<div id="main-content" class="container">My test text</div>

以及 css 文件中的以下 css 指令：

div.container{margin:5px}
div#main-content{margin-left:235px; ...}

我想在我的 css 中定义 div#main-content 没有这个边距，但它是默认值。

我怎么能做到？我不想这样做，margin-left:0px因为如果我有一个全局样式（说所有都div.container应该有 5px 的边距，我希望它适用于我以前的 div。这些数据可能会改变。

4

4 回答 4

4

没有纯 CSS 方法可以在不明确将其设置为另一个值的情况下删除属性值声明。

所以如果你有这样的情况：

 <div id="divA" class="class3 class1"></div>
 <div id="divB" class="class3 class2"></div>

 .class1{margin:2px;}
 .class2{margin:3px;}
 .class3{margin:10px;}

...并且您想取消 class3 的效果，以便 divA 的边距为 2px，而 divB 的边距为 5px，您唯一的纯 CSS 资源将涉及明确引用每个案例。IE 在您的覆盖样式表中，您必须重新断言：

 .class1{margin:2px;}
 .class2{margin:3px;}

...等等，但许多类/选择器上下文可能会受到影响。这恐怕是不现实的。

如果您愿意深入研究 JavaScript，您实际上可以从元素中删除类名。

有关如何执行此操作的直接 JavaScript 示例，请参阅：Remove CSS class from element with JavaScript (no jQuery)

如果你想要更简单的代码，并且愿意使用 JavaScript 库，jQuery 将让你在一行中做到这一点，如下所示：

$('divA').removeClass('class3');
于 2012-08-06T11:33:10.780 回答
3

You might add another css class, like .no-left-margin

<div id="main-content" class="container no-left-margin">My test text</div>

and add to your css

.no-left-margin{
 margin-left: 0px !important;
}
于 2012-08-06T11:19:14.787 回答
1

As long as your style sheet is after the original one you can use the same selectors in css and it will overide it.

And then just put

div.container{margin:5px}
div#main-content{margin-left:auto;}
于 2012-08-06T11:18:28.543 回答
1

嘿，现在习惯了

.container#main-content{margin-left:xxxx; ...}
于 2012-08-06T11:18:21.270 回答