第三周(CSS position:relative fixed absolute的区别)

.box {
    display: inline-block;
    width: 100px;
    height: 100px;
    background: red;
    color: white;
  }
  
  #one {
    position: absolute;
    top: 20px;
    left: 20px;
    background: blue;
  }

  #two {
    position: relative;
    top: 156px;
    left: 200px;
    background: blue;
  }
  #four {
    position: fixed;
    top: 50px;
    left: 60px;
    background:red;
  }

 

relative:当进行relative定位时,看起来似乎其已经脱离了普通文档流,但实际上依然在普通文档流中占据空间.

fixed:依据浏览器窗口进行定位,移动轮动条元素位置不变.

absolute:依据离其最近的设定了position定位的祖父辈元素进行绝对定位.

posted @ 2018-10-30 21:41  飞机飞过天空  阅读(161)  评论(0编辑  收藏  举报