网站地图    收藏   

主页 > 前端 > css教程 >

css属性选择器定义 优先级问题 (input[type=text]) -

来源:自学PHP网    时间:2015-04-14 14:51 作者: 阅读:

[导读] 像常规的id选择器( test) 类选择器class( test) 标签选择器input (中间还有一些类型不详举了),相比大家都很清楚这次遇到就是input[type=text] {background:red} 和 类选择器 aa{background:black}...

像常规的id选择器(#test) > 类选择器class(.test) > 标签选择器input (中间还有一些类型不详举了),相比大家都很清楚
 
这次遇到就是input[type=text] {background:red} 和 类选择器 .aa{background:black} 的优先级问题(aa是定义在input 的class上).
 
举例如下:
 
复制代码
<style>
input{
background:red;
}
</style>
<body>
<style>
    .aa{
        background:black;
 
    }
</style>
<input class='aa' type='text' value=''/>
</body>
</html>
复制代码
input显示结果是什么? 是black.
 
 
 
而以下代码:
 
复制代码
<html>
<style>
input[type=text] {
background:red;
}
</style>
<body>
<style>
    .aa{
        background:black;
 
    }
</style>
<input class='aa' type='text' value=''/>
</body>
</html>
复制代码
结果则是red了!出乎我的意料之外,根本没往这方面想,所以调试了好久(因为遇到的2个css不在一个外部引用的文件里).
 
以此为鉴,分享给大家.

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论