css怎么可以不继承父元素的样式?

css怎么可以不继承父元素的样式?下面本篇文章给大家简单介绍一下。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

css怎么可以不继承父元素的样式?

可以通过重新声明,用!important或者在子元素里面写style=""(html里面的的style优先级最高)来覆盖继承的样式。

说明:

这个问题应该在写css的时候考虑到后面的问题

一般只有通用的样式,和结构固定的模块适合使用继承来应用css

否则的话,不应该让样式随便继承,对于结构或表现差异很小的两个模块,也不适合用继承来实现

好点的方式是:把同样的,不易变化的样式部分抽离出来,然后用组合的方式应用到不同模块。

比如两个div

<div class="a"></div>
<div class="b"></div>

可以提取出共同的样式,放在一个声明下:

.fixedAd {position:fixed;width:200px;height:200px;border:1px solid #ccc;}

然后对于不同的div编写自己的样式:

.a {color:#ffc;background:#ccf;}
.b {color:#777;background:#999;}

最后组合的html结构是:

<div class="a fixedAd"></div>
<div class="b fixedAd"></div>

总之是:组合优于继承 这个和编程的道理差不多,呵呵

更多web前端开发知识,请查阅 HTML中文网 !!

以上就是css怎么可以不继承父元素的样式?的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » CSS3 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏