定位 position
html结构是fixed包裹relative,relative包裹absolute
position:relative;相对定位
a 不影响元素本身的特性
b 不使元素脱离文档流(元素移动之后原始位置会被保留)
c 如果没有定位偏移量,对元素本身没有任何影响
d 提升层级
定位元素位置控制:top|right|left|bottom 定位元素偏移量
position:absolute;绝对定位
a 使元素完全脱离文档流
b 是内嵌支持宽高
c 如果有定位父级 相对于 定位父级发生偏移,没有定位父级相对于document(可视区域)发生偏移
d 相对定位一般都是配合绝对定位元素使用
f 提升层级
z-index: [number];定位层级
a 定位元素默认后者层级高于前者
b 建议在兄弟标签之间比较层级
position:fiexd;固定定位
与绝对定位的特性基本一致,差别是始终相对整个文档进行定位
问题:IE6不支持固定定位
定位其他值
position:static;默认值
position:inherit;从父元素继承定位属性的值(不兼容)
定位清浮动方法,遮罩滤镜
position:absolute; 绝对定位元素子级的浮动可以不用写清浮动方法
position:fiexd;固定定位元素子级的浮动可以不用写清浮动方法(IE6不兼容)
遮罩弹窗
标准不透明度:opacity:0-1
IE滤镜(IE6,7) :filter:alpha(opacity=0-100);
The less routine the more life !