HTML中三种定位relative,absolute,fixed后,盒子…

2018-06-24 00:58:22来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

1 . 相对定位relative:顾名思义,相对定位是相对于自己的位置来进行偏移,如下图:

              

    以盒子中心为基准,为每条边的正方向,例:

      向右移动20px :  代码为left:20px;或者right:-20px;

      向下移动20px  :      代码为top:20px;或者bottom:-20px;

 

      

2 . 绝对定位:absolute

  以其第一个定位的祖辈级盒子为标准,定位祖辈级的中心方向为正,如下图:

    

3 . 固定定位fixed,是独立于body标签之外的,只以网页html为基准的,其定位方式与绝对定位相似.都是以中心方向为正方向.

  其宽度百分比也是只以html为基准的.

 

注:  1.如果没有对父级定位,绝对定位absolute则默认以其第一个定位的祖辈为标准.

  2.绝对定位和相对定位的盒子,其宽度百分比是以第一个定位祖辈为基准的;默认的是以body为基准的

  

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:(一)对百度前端技术学院2017年春季的参赛学习笔记

下一篇:box-shadow技巧分享