CSS权值比较(读书笔记)】的更多相关文章

1.继承0.1    标签1    类选择符10    ID选择符100 2.层叠:后面的样式会覆盖前面的样式. 3.内联样式表(标签内部) > 嵌入样式表(当前文件中) > 外部样式(外部文件) 4.!important具有最高权值,p{color:red  !important;} 5.!important > 用户自己设置的样式 > 网页制作者样式 > 浏览器默认样式 6.class选择器和属性选择器同优先级. 7.像这种.dog > p多了特殊符号的,还是和 .…
计算指定选择器的优先级:重新认识CSS的权重 标签的权值为 0,0,0,1 类的权值为 0,0,1,0 属性选择的权值为 0,0,1,1  ID的权值为 0,1,0,0 important的权值为最高 1,0,0,0 使用的规则也很简单,就是 选择器的权值加到一起,大的优先:如果权值相同,后定义的优先 .虽然很简单,但如果书写的时候没有注意,很容易就会导致CSS的重复定义,代码冗余. 从上面我们可以得出两个关键的因素: 权值的大小跟选择器的类型和数量有关 样式的优先级跟样式的定义顺序有关 总结:…
<style type="text/css">p{color:red;}.first{color:green;}/*因为权值高显示为绿色*/ span{color:pink;}/*设置为粉色*/p span{color:purple;} </style></head><body> <h1>勇气</h1> <p class="first">三年级时,我还是一个<span>胆…
选择器权值: 标签选择器:1 类选择器和伪类选择器:10 ID选择器:100 通配符选择器:0 行内样式:1000 !important 在一定条件下,优先级最高 常用的css样式命名 页面结构页头:header页面主体:main页尾:footer内容:content/container容器: container 导航:nav侧栏:sidebar栏目:column页面外围控制:wrapper左右中:left right center 导航导航:nav主导航:mainnav子导航:subnav顶导…
外部样式表<内部样式表<内联样式: HTML 标签选择器的权值为 1: Class 类选择器的权值为 10: ID 选择器的权值为 100: 内联样式表的权值最高 1000: !important权值最高: 脚本的样式最牛逼: 以上所有都一样,看顺序,后者覆盖前者.…
选择器权值 标签选择器:权值为1 类选择器和伪类:权值为10 ID选择器:权值为100 通配符选择器:权值为0 行内样式:权值为1000 !important规则: 可调整样式规则的优先级 添加在样式规则之后,中间用空格隔开 div{color:red !important;}…
继承是没有权值的,比通配符的的权值0还要低. 选择器是不分上下级的.只管优先级. 第一等:代表内联样式,如: style=””,权值为1000. 第二等:代表ID选择器,如:#content,权值为0100. 第三等:代表类,伪类和属性选择器,如.content,权值为0010. 第四等:代表类型选择器和伪元素选择器,如div p,权值为0001. 通配符.子选择器.相邻选择器等的.如*.>.+,权值为0000. 继承的样式没有权值…
注: 此书出版于2009年,所以有些知识...你懂得. 有些我熟悉的知识点,就没有记录下来了,所以想了解更多的细节,还是去看下此书吧. 暗灰色标记部分,是我自己的理解,有不对或要补充的地方,还请大家多多指教. 代码演示我统一放到了jsfiddle上,国内访问速度稍慢些,大家耐心点.或是大家知道国内有类似的在线调试网站,麻烦和我分享下,在此先谢了. 该笔记中只给出了部分代码演示链接,如果想看该书的完整示例代码,可到百度云:http://pan.baidu.com/s/1o64sPR0 下载,我已经…
一.css和文档层叠 css规定了冲突规则,这些规则统称为层叠.这些规则定义了样式发生冲突时以优先级高的为准. 常用的优先级判定: 1. 开发者样式>读者样式>浏览器样式(除非使用!important标记 ) 2. id选择符>(伪)类选择符>元素选择符 3. 权重相同时取后面定义的样式 元素 元素(element)是文档结构的基础.在css中,元素通常分为两种形式:替换元素和非替换元素. 替换元素是指用来替换元素内容的部分并非由文档内容直接表示,如img.input都是由属性来替…
CSS揭秘读书笔记      (一) 一.半透明边框 要想实现半透明边框可以使用border: border: 10px  solid  hsla(0,0%,100%,.5); background:white; background-clip:padding-box; ①  hsla:h是色调,取值范围是0-360.s是饱和度,取值范围是0%-100%.l是亮度,取值范围是0%-100%.a是透明度,取值范围是0-1. ② background-clip:用于调整背景图的显示区域,有3个值,b…