web前段基础5

position:relative ;

相对定位

特点：

  (1)不影响元素本身的特性；

（2）不影响元素脱离文档流

（3）如果没有定位偏移量，对元素本身没有任何影响。

定位元素位置控制：

top/right/bottom/left  定位元素偏移量。

position:absolute;//绝对定位

(1)使元素脱离文档流

(2)使内嵌元素支持宽高

(3)块属性标签内容撑开宽度

(4)如果有定位父级相对于定位父级发生偏移，如果没有定位父级相对于整个文档发生偏移。

(5)相对定位一般都是配合绝对定位使用。

定位元素层级默认后者层级高于前者

z-index  ：[number]；定位层级。

body<html<文档；

绝对定位是相当于整个文档发生偏移的；

绝对定位会去找定位父级，然后根据定位父级发生偏移。

opacity:0.5;不透明度。值为0~1；（标准浏览器支持）

IE私有滤镜：filter:alpha(opacity=0~100);如：

filter:alpha(opacity=50);ie8及ie8以下都需要；

position:fixed;固定定位；

特性和绝对定位一样：但是固定定位始终是相当于整个文档进行定位的，不管其父级有没有定位。

ie6不支持固定定位；

position ：static；定位的默认值；

position:inherit;从父级继承定位属性的值；

定位元素的问题：

（1）ie6下父级的overflow：hidden是包不住子级的相对定位的；

解决方法，让父级元素也变为定位元素；

（2）ie6下定位元素的父级宽高都为奇数，那么在ie6下定位元素的right和bottom都有一像素的偏差。

解决方法，让父级元素的宽高为偶数；