HTML属性的使用

标准文档流：

    指元素按照块级元素 或者行内元素 的性质 从上到下 从左到右依次排列

行内元素：元素可以排列在一行 并且宽高 等于自身内容的宽高

块元素：    元素独自一行 并且可以设置宽高

diaplay属性：

     inline：将元素转化为行内元素的性质

     block：将元素转化为块元素的性质

     inline-block：将元素转化为行内块级元素

     none：将元素隐藏

元素内容在块元素内垂直居中对齐的条件：

    1，元素具有宽高

    2，进行水平对齐

    3， 进行垂直对齐

    4，设置行高为元素高度

float（浮动 ：脱离了文档流）：

  left：将元素进行左浮动

  right：将元素进行右浮动

  none：元素的默认值 不浮动

浮动的第一张情况：

  将两种块元素排列在一行时，必须将两个元素都设置浮动。

浮动的第二种情况：

  元素在父级元素中进行浮动的时候，伏击只会参照未浮动的元素为元素的高度，浮动的元素会被排挤在外面

浮动的第三中情况：

  在父级容器中进行浮动时，父级的边框会造成塌陷效果并且没有高度

浮动的第四中情况：

  父级元素进行浮动时，如果里面的元素也进行浮动时，那么只会认识到浮动元素内容的宽度和高度。

 clear（清除浮动）：

     表示清除浮动元素对当前元素造成的影响；

     并且清除的方向必须和其他元素浮动的方向对应；

          或者直接清除两侧的浮动

  left：清除左浮动

  right：清除右浮动

  none：不清除浮动



解决父级边框塌陷的四种方式：

  1.给父级元素末尾添加空的div，并清除浮动

     <div style="clear.both"></div>

  2.给父级元素设置高度

      
  3.使用overflow属性（文本溢出处理）

   hidden：将文本溢出部分隐藏

   scroll：将文本溢出部分以滚动条的形式查看

   auto：将文本溢出部分以一个滚动条的形式查看

   visible：默认值，文本溢出在容器外

  overflow：hidden；可以去除边框塌陷问题，因为文本溢出会到当前元素最高位置，缺点不能用于js情况下的下拉列表

  4.给父级添加伪类after（在。。。之后）

    .clear:after{

                content: "";

              display: block;

              clear: both;

    }