浮动：重要
table div+css
页面布局方式

 浮动：
     1.浮动会将元素排在文档流之外，脱离文档流
     2.如果一个元素浮动了，不占据页面空间了
     3.其余在文档流之内的元素要上前补位

 属性：float:
 取值：
      none   默认值
      left   向左浮动
      right  向右浮动

 作用：能让块元素显示在一行


 清除浮动： 
    1.浮动元素后面添加空元素






        /*去掉li的点*/
        li{
            list-style:none;
        }
        a{
            /*颜色*/
            color:#fff;
            /*去掉下划线*/
            text-decoration:none;
        }
        ul{
            /*背景颜色*/
            background:orange;
            width:1200px;
            /*让ul居中*/
            margin:0 auto;
            height:40px;
            /*文字垂直居中*/
            line-height:40px;
        }
        li{
            /*浮动*/
            float:left;
            width:100px;
            /* border:1px solid #000; */
                            /*文字水平居中*/
            text-align:center;
        }







                    /*清除浮动方法一*/
            /*.clear{
               clear:both;清除浮动两端所带来的影响
            }*/
        /*清除浮动方法二*/
           /* overflow:visible  / hidden; scroll/ auto */
           /* .box{ */
                /* overflow:hidden; *//*给父元素添加*/
                /* overflow:auto;
                               } */

        /*清除浮动的方法三*/
        /* .box{
            height:200px;
        } */

        /*清除浮动方法四  伪类   推荐使用*/
        .box:after{
            content:'';/*在box后面添加内容为空*/
            display:block;/*把添加的内容转换成块元素*/
            clear:both;  /*清除元素两端的浮动*/