CSS 样式覆盖原理示例介绍
发布时间：2013-08-18 09:53:05 作者：佚名 
我要评论
我要评论对同一个标签设置多个相同属性，但是值不一样，结果会是怎样呢？到底是谁覆盖了谁，下面为大家详细解读，有此需求的朋友可以参考下，希望对大家有所帮助
对同一个标签设置多个相同属性，但是值不一样，那么该标签的属性会根据那个设定的为标准呢？
对于同一个标签元素设置属性，满足这样一个规则：元素单独设置的样式>class命名样式>标签样式。样式override父级别的。
<style type="text/css">
#txt{ background-color:Red}
.txt{ background-color:Green}
input {background-color:Black}
</style>
<input id="txt" type="text" class="txt" />
<input type="text" class="txt" />
<input type="text" />
对于同一个标签元素设置属性，满足这样一个规则：元素单独设置的样式>class命名样式>标签样式。样式override父级别的。
复制代码
代码如下:<style type="text/css">
#txt{ background-color:Red}
.txt{ background-color:Green}
input {background-color:Black}
</style>
<input id="txt" type="text" class="txt" />
<input type="text" class="txt" />
<input type="text" />
相关文章
- 下面小编就为大家带来一篇CSS样式覆盖规则全面了解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧，祝大家游戏愉快哦2016-08-05
- 这篇文章主要介绍了css文件中的样式类被覆盖，js文件中的变量未定义问题的相关资料,需要的朋友可以参考下2016-04-27
- 很多的新手朋友们对css样式加载顺序和覆盖顺序的理解有所偏差，下面用示例为大家详细的介绍下，感兴趣的朋友不要错过2013-12-19
- 多重样式（Multiple Styles）： 如果外部样式、内部样式和内联样式同时应用于同一个元素，就是使多重样式的情况.有个例外的情况，就是如果外部样式放在内部样式的后面，则2013-02-01
- 在页面中，我们常用id、class以及内联样式表来设置我们的组件CSS，在网页中css样式根据css优先级来使用，优先级高的会覆盖优先级低的css样式，本文通过实例代码给大家详细2023-01-03
最新评论