zoukankan      html  css  js  c++  java
  • HTML中三种定位relative,absolute,fixed后,盒子的百分比宽度及位置易错点

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

                  

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

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

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

          

    2 . 绝对定位:absolute

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

        

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

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

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

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

      

  • 相关阅读:
    Python Day14
    Python Day13
    Python Day12
    Python Day11
    Python Day10
    Python Day9
    Python Day8
    Python Day7
    Python Day6
    Python Day5
  • 原文地址:https://www.cnblogs.com/LChenglong/p/6413626.html
Copyright © 2011-2022 走看看