相对定位:
1.不影响元素本身特性(即该是块元素还是块元素该是内联元素还是内联元素)。
2.不能使元素脱离文档流。
3.提升层级
注意:
若子级大于父级的话,在标准浏览器中,子级会将父级撑破,在IE6下子级会将父级撑开。给父级加overflow:hidden会将超出父级的子级部分隐藏。
但是若是给子级加relative,在IE6下父级的overflow:hidden是包不住子级的相对定位的,子级会将父级撑破,这时给父级加relative即可。
绝对定位:
1.使内联元素支持宽高
2.块元素在没有设置宽度的情况下,内容撑开宽度
3.使元素脱离文档流
4.若有定位父级,则相对于定位父级定位,没有定位父级,相对于文档定位(body<html<文档)
5.提升层级
注意:在IE6下定位元素的父级宽高都为奇数的话,那么定位元素的right,bottom属性就会有1px的偏差,没有解决办法,要尽量避免。
固定定位:
与绝对定位基本特性一致,差别是:absolute相对文档定位会随着滚动条滚动。
IE6下不支持固定定位。
定位元素的层级关系:
默认是后者高于前者,并且z-index<1,可通过设置z-index来设置层级关系,z-index只能作用于定位了的元素。
附加知识:
标准浏览器:opacity:0~1
IE8及以下(IE私有):filter:alpha(opacity:0~100)