取消一些CSS样式 [英] Cancel some CSS Style

查看:289
本文介绍了取消一些CSS样式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

对于一个项目,我必须使用定义的样式表。



但是,有一些样式不适合这个网站(例如边缘)。

/ p>

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



've this:

 < div id =main-contentclass =container>我的测试文本< / div> 

和css文件中的以下css指令:

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



我想在MY css中定义div#main-content hasn'这个保证金,但它是默认值。



我该怎么办呢?我不想做一个 margin-left:0px ,因为如果我有一个全局风格(说所有 div.container

解决方案

没有纯CSS方法来删除属性值声明,而不显式地将其设置为另一个值。



因此,如果你有这样的情况:

 < div id =divAclass =class3 class1>< / div> 
< div id = divBclass =class3 class2>< / div>

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

...并且要取消class3的效果, margin是2px,divB的margin是5px,你唯一的纯CSS资源将涉及到明确的引用每个case。在你的覆盖样式表中,你必须重新断言:

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

...等等,因为许多类/选择器上下文可能会受到影响。这可能是不现实的。



如果你愿意深入JavaScript,你实际上可以从元素中删除类名。



有关如何执行此操作的直接JavaScript示例,请参阅:使用javascript(无Jquery)从元素中删除css类



如果您想要更简单的代码,并且愿意接受JavaScript库,jQuery将让你在一行这样做:

  $('divA')。removeClass('class3'); 


For one project, I've to use a defined stylesheet. I cannot edit it, I've to take it as it comes.

But, there is some styles which aren't adequate for this website(e.g. margin).

I've too create my own CSS file which override some of those properties.

One example, if I've this:

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

And the following css instruction in a css file:

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

I would like in MY css to define that the div#main-content hasn't this margin but it's default value.

How could I do it? I don't want to do a margin-left:0px because if I've a global style(saying that all div.container should have a 5px margin, I would like it applies to my previous div. And thoses data could change.

解决方案

There's no pure-CSS way to remove a property value declaration without explicitly setting it to another value.

So if you have a situation like this:

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

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

...and you want to cancel the effects of class3 so that divA has margin of 2px, and divB has margin of 5px, your only pure-CSS recourses will involve explicitly referencing each case. I.E. in your overriding stylesheet, you would have to re-assert:

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

...and so on for however many classes/selector contexts may be affected. This is probably unrealistic.

If you're willing to dive into JavaScript, you can actually remove the class-name from the element.

For straight-up JavaScript example of how to do that, see: Remove css class from element with javascript ( no Jquery)

If you want simpler code, and are willing to take on a JavaScript library, jQuery will let you do this in one line like this:

$('divA').removeClass('class3');

这篇关于取消一些CSS样式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆