前端学习笔记之背景、cursor、定位（static、relative、fixed、absolute）

1）背景

背景图片的使用：

background-image:url("XX")

background-position:

background-attachment:

background 的缩写属性

2）cursor：

 3）定位

3.1）static

3.2）relative，相对定位

定位参照对象为元素自己原来的位置，相对定位之后，灵魂出窍，肉体还在原来的位置占据空间

 

 3.2）固定定位fixed

参照对象是浏览器的视图，元素会脱离标准流

脱标元素的特点：大部分变成block，变成块级元素。但是与传统块级元素不同，传统块级元素宽度高度为auto，默认占据父元素的宽度；但是脱标后的元素没有父元素，宽度高度为auto，所以它的宽度和高度会由他的内容决定。

3.3）绝对定位absolute：

定位对象：最邻近的定位祖先元素

定位方式：子绝父相

定位公式：

定位对象宽度=left+right+margin-left+margin-right+内容宽度

定位对象高度=top+bottom+margin-top+margin-bottom+内容高度

移动自身的一半距离：transform:tanslate(-50%);

4.定位的层叠关系

1）定位元素一定在非定位元素之上

2）都是定位元素，通过CSS z-index进行控制