一．overflow:hidden、display:none、visibility:hidden之间的区别
overflow:hidden是表示隐藏超出的部分，不显示超出盒子大小的内容
display:none 表示隐藏元素，不再占位置了
visibility:hidden表示隐藏元素，但是保留位置
二．盒子的内外边距
内边距：padding
盒子内容与边框的距离，分别有上下左右边距，可以分开写不同方向的内边距，语法如：padding-left:5px;  padding-right:5px; padding-top:5px; padding-buttom:5px;还有就是连写，但是要注意顺序，顺序如下：上右下左，千万不要打乱顺序。
外边距：margin
盒子与盒子之间的距离或者盒子与别的东西的距离，用法跟padding一样
三．清除浮动
原因：父盒子不适合给高度，子盒子会自动撑开盒子，但是由于子盒子全部浮动而导致父盒子没有高度，那么下面的盒子会浮上来，导致页面布局发生变化
  下面来说下清除浮动的几种方式，各自的优缺点
1.在浮动的最后一个盒子下面添加一个空的标签，给上类名.clearfix，并且给该标签设置样式.clearfix {clear:both;}   缺点：增加了额外的标签
2.在都浮动的盒子的父级盒子添加overflow:hidden;  缺点：内容增多时会导致不会自动换行，导致内容被隐藏
3.在都浮动的盒子的父级盒子添加一个类名.clearfix，然后设置样式:   .clearfix::after{content:””;display:block;height:0;visibility:hidden;clear:both;}  .clearfix {*zoom:1;} 优点：符合闭合元素的思想，结构语义化正确  缺点：ie6,7不支持
4.在都浮动的盒子的父级盒子添加一个类名.clearfix，然后设置样式:   .clearfix::before,.clearfix::after{content:””;display:block;}   .clearfix::after{clear:both;}    .clearfix {*zoom:1;}

一．overflow:hidden、display:none、visibility:hidden之间的区别
overflow:hidden是表示隐藏超出的部分，不显示超出盒子大小的内容
display:none 表示隐藏元素，不再占位置了
visibility:hidden表示隐藏元素，但是保留位置
二．盒子的内外边距
内边距：padding
盒子内容与边框的距离，分别有上下左右边距，可以分开写不同方向的内边距，语法如：padding-left:5px;  padding-right:5px; padding-top:5px; padding-buttom:5px;还有就是连写，但是要注意顺序，顺序如下：上右下左，千万不要打乱顺序。
外边距：margin
盒子与盒子之间的距离或者盒子与别的东西的距离，用法跟padding一样
三．清除浮动
原因：父盒子不适合给高度，子盒子会自动撑开盒子，但是由于子盒子全部浮动而导致父盒子没有高度，那么下面的盒子会浮上来，导致页面布局发生变化
  下面来说下清除浮动的几种方式，各自的优缺点
1.在浮动的最后一个盒子下面添加一个空的标签，给上类名.clearfix，并且给该标签设置样式.clearfix {clear:both;}   缺点：增加了额外的标签
2.在都浮动的盒子的父级盒子添加overflow:hidden;  缺点：内容增多时会导致不会自动换行，导致内容被隐藏
3.在都浮动的盒子的父级盒子添加一个类名.clearfix，然后设置样式:   .clearfix::after{content:””;display:block;height:0;visibility:hidden;clear:both;}  .clearfix {*zoom:1;} 优点：符合闭合元素的思想，结构语义化正确  缺点：ie6,7不支持
4.在都浮动的盒子的父级盒子添加一个类名.clearfix，然后设置样式:   .clearfix::before,.clearfix::after{content:””;display:block;}   .clearfix::after{clear:both;}    .clearfix {*zoom:1;}