相对定位和绝对定位

<div>文档中的一个分隔区块或者一个区域部分划定区域,类似图层</div>

绝对定位

• 以整个网页布局为基准

  • 四个边距: left和right, bottom和top
  • 分别对应左右下上四个网页距离边距

  <div name = "mydiv" id="mydiv" style="position:absolute;left:200px;top:200px">
      JavaScript/css
  </div>
  

相对定位

• 以当前标签位置为基准

  • 4个属性: left和top(与绝对位置, width和height
  • width: 尺寸大小的宽度
  • height: 尺寸大小的高度

   <div style="position:relative;left:200px;top:100px;width:400px;height:50px">
          JavaScript/css 
  </div>
  

div居中

• <div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);s">
        JavaScript/css 
  </div>
  

•   <div style="text-align: center"> -行内元素居中
             JavaScript/css
    </div>