行内元素：
与其他行内元素并排；不能设置宽、高。默认的宽度，就是文字的宽度。块级元素：
霸占一行，不能与其他任何元素并列；能接受宽、高。如果不设置宽度，那么宽度将默认变为父亲的100%。行内元素和块级元素的分类：
在以前的HTML知识中，我们已经将标签分过类，当时分为了：文本级、容器级。
从HTML的角度来讲，标签分为：
文本级标签：p、span、a、b、i、u、em。容器级标签：div、h系列、li、dt、dd。我们可以通过display属性将块级元素和行内元素进行相互转换。display即“显示模式”。
块级元素可以转换为行内元素：
一旦，给一个块级元素（比如div）设置：
display: inline;那么，这个标签将立即变为行内元素，此时它和一个span无异。inline就是“行内”。也就是说：
此时这个div不能设置宽度、高度；此时这个div可以和别人并排了。行内元素转换为块级元素：
同样的道理，一旦给一个行内元素（比如span）设置：
display: block;那么，这个标签将立即变为块级元素，此时它和一个div无异。block”是“块”的意思。也就是说：
此时这个span能够设置宽度、高度此时这个span必须霸占一行了，别人无法和他并排如果不设置宽度，将撑满父亲这便引出我们今天要讲的内容：浮动。
总结：标准流中的文字不会被浮动的盒子遮挡住。（文字就像水一样）
给浮动元素的祖先元素设置高度，如果一个元素要浮动，那么它的祖先元素一定要有高度。有高度的盒子，才能关住浮动。（记住这句过来人的经验之语）。此方法不能适应页面的快速变化。
clear就是清除，both指的是左浮动、右浮动都要清除。clear:both的意思就是：不允许左侧和右侧有浮动对象。这种方法有一个非常大的、致命的问题，它所在的标签，margin属性失效了，导致两个div之间，没有任何的间隙了
外墙：在这两个div中间用一个新的div隔开，然后给这个新的div设置clear: both;属性；同时，既然这个新的div无法设置margin属性，我们可以给它设置height，以达到margin的效果
内墙：内墙法可以给它所在的div撑出宽度,让div的高度可以自适应内容。
<!--CSS 浮动 隔墙法--> <div class="box1"> <p></p> <p></p> </div> <!-- 为了防止两个div贴靠，我们可以在这两个div中间用一个新的div隔开，然后给这个新的div设置clear: both;属性； 同时，既然这个新的div无法设置margin属性，我们可以给它设置height，以达到margin的效果这便是隔墙法 --> <div style="clear: both; height: 10px;"></div> <div class="box1"> <p></p> <p></p> </div> <!--CSS 浮动 内墙法--> <div class="box1"> <p></p> <p></p> <!-- 内墙法可以给它所在的div撑出宽度。即：box1的高度可以自适应内容 --> <div style="clear: both; "></div> </div> <div class="box1"> <p></p> <p></p> </div>这个属性的本意，就是将所有溢出盒子的内容，隐藏掉。但是，我们发现这个东西能够用于浮动的清除。 我们知道，一个父亲，不能被自己浮动的儿子撑出高度，但是，如果这个父亲加上了overflow:hidden；那么这个父亲就能够被浮动的儿子撑出高度了。这个现象，不能解释，就是浏览器的偏方。 并且,overflow:hidden;能够让margin生效
标准文档流中，竖直方向的margin不叠加，取较大的值**作为margin(水平方向的margin是可以叠加的，即水平方向没有塌陷现象)
盒子居中margin:0 auto;
善于使用父亲的padding，而不是儿子的margin
