HTML&&CSS复习(九)

精灵图

通过设置background_position:10px（上下） 20px（左右）; 两个属性

代码格式

background: url(./img/20180909111901245.png) no-repeat 10px 20px;

或者

background: url(./img/20180909111901245.png) no-repeat

background_position:10px（上下） 20px（左右）

什么时候使用绝对定位

满足任何一个条件时，使用绝对定位：

1、元素出现在一个天马行空的位置

2、元素是否存在，不影响其他元素排列

3、单个元素在某个区内水平垂直居中

fixed和absoult的区别

fixed是绝对定位的一种特殊情况，他们参考系不一样

• absoult参考系是有定位（设置了position）父元素

• fixed参考系是视口（浏览器窗口）

属性值计算过程

无属性值

1、确定声明值：参考样式表中没有冲突的声明，作为css属性值

css属性值：作者样式表和浏览器默认样式 没有冲突的直接变为最终样式

2、层叠冲突：对样式表有冲突的申明使用层叠规则，确认css属性值

css属性值：比较重要性（作者样式表>浏览器默认样式表）

比较特殊性（比较选择器各种权重）

比较源次序（后面的代码的覆盖前面的）

color：inherit;继承父元素的颜色

3、使用继承：对仍然没有值的属性，若可以继承，则继承父元素的值。

4、 使用默认值：对仍然没有值的属性，使用默认值。

每个属性都值

设置的宽高最后会被换算成以px为单位

伪类选择器

爱恨法则 Love Hate L(link)V(visited)H(hover)A(active)顺序

contenteditable属性 该属性是一个布尔属性,可以设置到任何元素上让该元素变为可以编辑状态

实际开发中用来制作富文本框.