1.相对定位 position :relative 即根据自己位置进行定位
后跟位置属性:right left too bottom
例如:position relative ; left 20px即刚才相对自己现在的位置左移20像素,后跟属性时,left和right只能选择其中一个 top和bottom也只选择其中之一。
相对定位不会影响原来的元素,原来的位置会保留,且支持z轴给予顺序,书写样式为z-index:1/2/3/4可无限给数值,支持负数。
书写样式例如:假设有两个div
.div1{width:200px; height:200px; background-color:red; float:left; position relative;left 200px; z-index: 1}
.div1{width:200px; height:200px; background-color:green; float:left; position relative;left 200px; z-index: 2}
此时绿色元素在红色元素上面。
2.绝对定位 position absolute
属性用法与相对定位基本一致
但是绝对定位,脱离标准流 原来的位置不会留着,
绝对定位是根据有定位的父级元素进行定位,如果父级元素没有定位,就会在找到最外层的元素直到html标签。