后退
刷新
前进
收藏
顶部
|
知道
黑匣子
富媒体
技术服务
CSS选择器及优先级
程序猿
CSS
CSS 选择器 优先级...
(shuke.2016-04-26 10:14)
通常我们可以将CSS的优先级由高到低分为六组:
1.无条件优先的属性只需要在属性后面使用 !important 【css定义中的用!important限定的定义却是优先级最高的,无论是在ie6-10或者Firefox和Chrome表现都是一致的,】。它会覆盖页面内任何位置定义的元素样式。当然,IE 6不支持这个属性,于是它也成为一种hack被很多人所熟知,真正使命被人淡忘。
2.第二高位的优先属性是在html中给元素标签加style。由于该方法会造成CSS的难以管理,所以不推荐使用。
3.第三级优先的属性是由一个或多个id选择器来定义的。例如 #id{margin:0;} 会覆盖 .classname{margin:3px;}。
4.第四级的属性由一个或多个 类选择器、属性选择器、伪类选择器定义。如 .classname{margin:3px;} 会覆盖 div{margin:6px;}
5.第五级由一个或多个 类型选择器定义。如 div{margin:6px;} 覆盖 *{margin:10px;} 。
6.最低一级的选择器是为一个通配选择器,用*{margin:10px;}这样的类型来定义。
另外,可以用一句极为简单的话来描述CSS优先级问题:当一个CSS选择器拥有更多的高级别属性时,它的优先级就会比较高。如 #i100 *.c20 *.c10{} 的优先级就会高于 #i100 *.c10 div p span em{} ,这是由于前者拥有一个第三级和两个第四级的选择器而后者第三级和第四级的选择器各为一个,当然前者优先级会比较高。
CSS选择器是一个非常灵活的CSS属性,优雅的使用它会使你的页面代码不再臃肿,而且还可以作为hack的妙用方法之一。
当比较多个相同级别的CSS选择器优先级时,它们定义的位置将决定一切。下面从位置上将CSS优先级由高到低分为六级:
位于<head/>标签里的<style/>中所定义的CSS拥有最高级的优先权。
第二级的优先属性由位于 <style/>标签中的 @import 引入样式表所定义。
第三级的优先属性由<link/>标签所引入的样式表定义。
第四级的优先属性由<link/>标签所引入的样式表内的 @import 导入样式表定义。
第五级优先的样式有用户设定。
最低级的优先权由浏览器默认。
理解了这些CSS优先级问题后,也就不必苦恼于样式定于中的此类问题了。
进度:100%
返回程序猿
解决织梦图集中上传图片时跳出302错误
HTML5很有意思的标签
图片新热点
网站自定字体,压缩字库让网页字体与图标
*.EOT是一种压缩字库,目的是解决在网页中嵌入特殊字体的难题。例如:网页前端开发人员在网页中使用...
查看详情
酷能微日志V1.1发布
酷能微日志V1.1发布一,PHP文件,无需数据库(日志生成TXT文件保存在DATA里)。3个文件搞...
查看详情
PHPCMS调用自动广告的问题
可以专门建立一个或者几个栏目,用于放置不同的广告。在后台建立栏目时,可以先填写广告栏目的ID,在加...
查看详情
js 图片带点幻灯播放效果,适合做BA
这个效果很适合BANNER,可以加连接,也可以做幻灯片。有图有真相:...
查看详情
【原创】phpcmsv9 关于站群同布
1.首先,建立一个发步点,填写FTP相关地址,为的是能够发步到你网站空间里。这样子你的网站就不要后...
查看详情
导航
模块
服务器应用
软件应用
设计师
程序猿
推广课程
制作
分享
原创
黑板报
运营与帮助
微平台
生活小百科
目录
HTML相关:
HTML/JS互转
HTML/UBB代码转换
JS/HTML格式化
CSS
CSS在线编辑器
Css压缩/格式化
HTML/JS/CSS过滤
JS组件
JS代码混淆
JS混淆加密压缩
正则在线测试
小功能
公众号编写
酷编辑
node
模块
工具箱
PinTuer
Ueditor
关于我们
ABOUT SHUKE
微博关注我们
点击关注
Copyright
coolneng.com
© Users from .
工具箱
矢量图标
▶
站内搜索
powered by shuke 2015-3-26 qq:896158959
首页
|
W3C
|
ME
Search
模块
服务器应用
软件应用
设计师
程序猿
推广课程
制作
分享
原创
黑板报
运营与帮助
微平台
生活小百科