9.1 CSS层叠性:所谓层叠性是指多中CSS样式的叠加,一般情况下,如果出现样式冲突,则会按照CSS书写的顺序,以最后的样式为准。CSS最后的执行口诀:长江后浪推前浪,前浪死在沙滩上。每个
9.2 CSS继承性:所谓继承制是指书写CSS样式表时,子标签汇集成父标签的某些样式,如我文本颜色和字号,想要设置一个可继承的属性,只需将他用于父元素即可。简单的的理解就是子承父业。注意:恰当地使用继承简化代码,降低CSS央视的复杂性。但是,如果在网页中所有的元素都大量继承样式,那么判断样式的来源就会很困难,所以对字体、文本属性等网页中通过样式可以继承。例如:字体、字号、颜色、行距等可以在body元素中统一设置,然后通过继承影响文档中所有有文本。并不知所有CSS属性都可以继承,例如,下面的属性就不具有继承性:边框、外边距、背景、定位、元素高属性。
9.3 CSS优先级:关于CSS权重,我们需要一套计算公式来去计算,这个就是CSS Specificity,我们成为CSS特性或非凡性,他是一个衡量CSS值优先级的一个标准,specificity用一个四位的数字串来表示,更像四个级别,值从左到右,一级大于一级,数位之间没有进制,级别之间不可超越。每个元素标签贡献值为:0,0,0,1;每个类,伪类贡献值为:0,0,1,0;每个ID贡献值为:0,1,0,0;每个行内样式贡献值为1,0,0,0。每个!important贡献值为:$无穷大。
9.4 权重叠加:权重是可以叠加的。举例:div ul li --->0,0,0,3;.nav ul li --->0.0.1.2;a:hover--->0.0.1.1;.nav a--->0,0,1,1;#nav p--->0.1.0.1。
9.5 继承的权重为0:注意:1、数位之间没有进制,比如说:0,0,0,5+0,0,0,5=0,0,0,10,而不是0,0,1,0,所以不会存在10个div能赶上一个类选择器的情况。2、继承的权重为0。
9.6 CSS权重6道精华题:第一题:
第二题:
第三题:
第四题:
第五题:
第六题:
9.7 优先级总结:1、使用了!important声明规则;2、内嵌在HTML元素的style属性里面的声明;3、使用了ID选择器的规则;4、使用了类选择器、属性选择器、为元素和伪类选择器的规则;5、使用了元素选择器;6、只包含一个通用选择器的规则;7、同一类选择器遵循就近原则(长江原则)。总结:权重是优先级的算法,层叠是优先级的表现。
10.1 看透网页布局本质:CSS就三大模块:盒子模型、浮动、定位,其余的都是细节。所谓盒子模型就是把html页面中的元素看成一盒矩形的盒子,也就是一个盛装内容的容器。每个矩形都由元素的内容、内边距、边框、和外边距组成。看透网页布局的本质:把网页元素比如文字图片等等,放入盒子里面,然后利用CSS摆放盒子的过程,就是网页布局。CSS其实没有太多逻辑可言,类似我们小时候玩的积木,可以自由地、随意地拜访出我们想要的效果。
10.2 认识盒子模型组成:由外向内依次是:与其他盒子的距离、盒子厚度、填充泡沫的厚度、内容。
10.3 盒子边框(border):边框就是那层皮:苹果皮、橘子皮、柚子皮…… 语法:border:border-widrh(边框宽度) border-style(边框样式) border-color(边框颜色);边框样式用于定义页面中边框的风格,常用属性值如下:
10.4 边框综合写法(一):可以随意加边框中的任意一条线。基本语法如下:
10.5 边框综合写法(二):基本语法如下:
10.6 合并细线表格:table{border-collapse:collapse}。collapse单词是合并的意思,border-collapse:collapse表示边框合并在一起。
网友评论