CSS的优先级和继承问题

本文详细介绍了CSS中的优先级规则,包括内联样式、内嵌样式、链接样式和导入样式的优先级顺序,以及ID、类和标签选择器的权重。同时,解释了解决CSS冲突的就近原则和选择器范围影响。此外,文章还探讨了样式继承的概念,强调了哪些属性可以继承,哪些不能,并列举了一系列具有继承性和非继承性的CSS属性,帮助理解CSS的继承机制和优化代码维护。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

CSS的优先级和继承问题

★CSS的冲突,即优先级
CSS本身的设置可以同时应用多个样式在同一个元素,此时样式之间可能出现冲突而达不到用户所想要的效果。
★解决CSS冲突的优先级规则:
● CSS层叠样式表引入方法的优先级:内联式>内嵌式>链接式>导入式
● 在多个外部样式中,后出现的样式的优先级高于先出现的样式,也就是俗称的覆盖
● 在样式中,选择器的优先级:ID样式>class样式>标记样式(以权重比喻:id的权重为100,class的权重为10,标签名的权重为1)
● 在样式后面加一个!important,例如这样:.abc {background:#fff !improtant;} 这个样式的优先级就会默认提升到顶级,全局样式就无法影响到它了。
✪注意:!important要写在分号的前面
优先级:

就近原则(离代码越近,优先级越高)
选择范围越小,优先级越高。细化CSS,通过多加父元素的选择符一层层包住,缩小选择范围

★样式继承:
继承是指我们设置上级(父级)的CSS样式,上级(父级)及以下的子级(下级)都具有此属性。一般只有文字文本具有继承特性,如文字大小、文字加粗、文字颜色、字体等。但注意有一些css样式是不具有继承性的。如border:1px solid red;

demo:

<p style="color:red;">如果你不知道自己<span>想做什么该做什么
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值