HTML新增元素

一.div

1. 块级元素—独占一行,可设置宽高; 例如: div,h1~h6,p,form,table

2. 行内元素—一行显示,不可设置height; 例如: span,a,img,input

3. 行内块元素的转换:

   display: inline | block | inline-block;
   

二.浮动float

标准流—上下,脱离标准流不占用位置,需要清除浮动clear(谁需要清除浮动谁使用clear); 超出部分,换行显示

float: left|rigth; /*居左或居右排列*/

/*两个盒子并排*/
.box1{
  float:left;
}
.box2{
  float:left;
}

1.清除浮动clear

clear: both;/*恢复标准流,不让浮动影响其他内容*/
.footer{
  clear:both;
}

三.定位position

1. 相对定位relative:

2. 绝对定位absolute—相对父元素进行偏移

   /*盒子居中*/
   .center{
      position: absolute;
      top:50%;
      left:50%;
      margin-top: -盒子一半height;
      margin-left: -盒子一半width;
   }