继承的样式html,如何让css不继承样式?

本文探讨了CSS中的继承特性,指出在某些情况下继承可能导致样式混乱。为了解决这一问题,建议采用覆盖方式清除继承样式,并强调组合应用CSS而非广泛依赖继承。文章提倡将通用样式抽取并组合应用,以提高代码复用和模块独立性。总结来说,应当谨慎使用继承,合理组织CSS结构。
摘要由CSDN通过智能技术生成

css的继承:就是给父级设置一些属性,子级继承了父级的该属性,这就是我们的css中的继承。

官方解释,继承是一种规则,它允许样式不仅应用于特定的html标签元素,而且应用于其后代元素。

5df3251f387d5457.jpg

有些时候,CSS继承了父元素的样式会很麻烦。请问有何方法可以清空继承的样式?如何让css不继承样式?

目前只能通过覆盖的方式清空样式

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

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

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

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

比如两个div

可以提取出共同的样式,放在一个声明下:.fixedAd {position:fixed;width:200px;height:200px;border:1px solid #ccc;}

然后对于不同的div编写自己的样式:.a {color:#ffc;background:#ccf;}

.b {color:#777;background:#999;}

最后组合的html结构是:

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值