Html中关于float,margin,padding的语法

1.float:left、right、【none（默认）】
   >加了浮动会破会块级元素独占一行的文档流
     （漂浮起来，空出其原来的位置给其他元素使用）
   >浮动:第一个元素先移动

   >clear:both 清除该元素的浮动（不受前面元素的浮动效果影响,设置分水岭）

 ---------------------------------------------------------------------
2.display:block、inline、inline-block
   >block:  可以将行内元素转为块级元素(一般不建议使用，可用于导航栏)
   >inline：   可以将块级元素转为行内原素(不建议使用)
   >inline-block：根据文本内自动缩放（不会独占一行，受度与宽度的影响）
----------------------------------------------------------------------
3.margin、padding:【只需记住上、右、下、左顺序】
   >margin:(外边距)【块级元素间的距离:用法类似于padding】
   >padding(内边距):【用来修饰行内文本文字距离块级元素的位置】
     ->写法1： padding:上、右、下、左（等价于写法2）
     ->写法2： padding-left;padding-right;padding-top;padding-bottom
     ->写法3： padding 10px;(上、右、下、左均为10px)
     ->写法4： padding 10px 20px;(上下10px,左右20px)
     ->写法5:  padding 10px 5px 20px;代表（top:10;right:5px;bottom:20px;left:10px）
----------------------------------------------------------------------
4.盒模型
   >  W3C元素宽度和高度的构成:
     ->width: =border-left+padding-left+width+padding-right+border-right
     ->height:=border-top+padding-top+height+padding-bottom +border-bottom