CSS学习随笔（二）——内联元素和块元素

元素本身带有默认的边距，所以在所有命令之前必须加一句：

*{margin:0;padding:0}，将默认的边距全部清零，注意必须写在第一句，否则会覆盖前面所有设置的样式。

CSS布局的元素分为内联元素和块元素。最常见的块元素是div，内联元素有span。下面来分析两者之前的区别

1、块元素里面可以包含块元素和内联元素，而内联元素里面不能嵌套块元素，只能包含内联元素。

2、块元素有宽和高，内联元素是没有的，即使为内联元素设置了width和height，也无效。

3、每个块元素独占一行，内联元素会在一行里显示。

如何解决内联元素没有宽和高的问题呢？这时候可以用display:inline-block来解决，将内联元素转换成内联块，注意此时内联元素依然可以在一行里显示。若写成display:block，则直接将内联元素转换成了块元素，不推荐。

若想要块元素在一行上显示，怎么办呢？这时候可利用浮动float解决：float:left/right。浮动是相对于父级元素的左右浮动，并且希望几个元素在同一行显示这几个元素都得加float。

浮动存在的问题：

1.浮动元素不占位置，这就导致在这之后的元素会与浮动元素重叠在一起。                                                                                        

2.加了浮动之后元素会脱离当前文档流，即“父不认子，子不认父”，原本父级与子级元素之间存在的继承等关系都将不存在。

 解决办法：紧接着在浮动元素之后加<div style=clear:both>，且与之必须是平行关系。