在上一篇中提到浏览器会根据权值来决定显示样式,那么我们来思考一个问题:如果在html文件中对于同一个元素可以有多个css样式存在并且这多个css样式具有相同权重值怎么办?要回答这个这个问题,我们会涉及到层叠。
层叠就是在html文件中对于同一个元素可以有多个css样式存在,当有相同权重的样式存在时,会根据这些css样式的前后顺序来决定,处于最后面的css样式会被应用。
如下面代码:
p{color:red;}
p{color:green;}
<p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>
最后 p 中的文本会设置为green,这个层叠很好理解,理解为后面的样式会覆盖前面的样式。
所以前面的css样式优先级就不难理解了:
内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中)。
本文详细解析HTML文件中同一元素存在多个CSS样式时,如何通过层叠原则确定最终应用的样式。包括内联样式、嵌入样式与外部样式间的优先级排序,以及实际代码示例的解释。
716

被折叠的 条评论
为什么被折叠?



