html布局相关

常规流中，一个块盒占一行，position默认为static

absolute（绝对定位）：根据整个页面来进行绝对定位，直接脱离了常规流定位，如果有多层绝对定位，会一层一层进行(相对)定位，如果没有，就根据页面进行定位

relative（相对定位）：自动适应，相对于当前其所在的位置进行对位，以自身当前位置为基准进行二次定位

fixed：（固定定位），始终位于页面的某个位置，只会根据界面进行定位

float：（浮动定位），也是脱离常规流，可以左浮动右浮动，如果有多个同级浮动，会进行依次排列

设置盒子居中：

margin:0 auto
width:设置长度

浮动流不占高度，可以采用清除浮动的方式进行box高度的生成(使用列)

content："";
display: block;
clear: both;
.clearfix::after{
}

ul li设置相关间距（可以设置li也可以设置a标签），以及设置居中（行高）

margin-left：40px;
line-height:60px

设置图片高度

display：block;
height:60px;

设置圆形

border-radius：100px;
/*以实际的高度为准*/

设置盒块隐形，一般来说有几种办法，但是：

opacity:0;/*这种以降低透明度达到隐形的方法，会对鼠标hover造成一定的影响，即：鼠标移动到了隐形的区域会自动显性，不受hover父级控制*/
display:none;/*可避免opacity的情况*/

最后是html的一点层级示意图

padding<!--代表的是内容至盒子边框的距离-->
margin<!--代表的是盒子与盒子之间的距离-->