position定位

作者: 微行丶简 | 来源:发表于2016-11-07 10:49 被阅读10次

position属性用来规定元素的定位类型。

属性值 描述
absolute 生成绝对定位的元素,相对于static定位以外的第一个父元素进行定位。
fixed 生成绝对定位元素,相对于浏览器窗口进行定位
relative 生成相对定位元素,相对于其它正常位置进行定位
static 默认值,没有定位,元素出现在正常的流中
inherit 规定应该从父元素继承position属性的值

注意

  • 绝对定位或固定元素会生成一个块级框,而不论该元素本身是什么类型。
  • 相对定位会相对于它在流中的默认位置偏移。
  • static情况下,忽略top,bottom,left,right,z-index声明。

应用场景

  • absolute

相对于父级元素右对齐

h2.pos_abs
{
position:absolute;
right:0px;
top:150px
}
  • fixed

Dialog浮层

.dislike-bg{
    display: none;
    position: fixed; //相对于浏览器的窗口定位
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    background: rgba(0,0,0,0.3);
    z-index: 1999;
}

相关文章

网友评论

    本文标题:position定位

    本文链接:https://www.haomeiwen.com/subject/itxouttx.html