CSS的内联和块元素

在CSS中display使用的最多属性值为：block（块级元素），inline（内联元素），inline-block(内联块元素)

以下是内联和块元素的区别：

块级元素（block）：可以设置宽高，margin，padding值等；

<div>块级元素</div>
<p>块级元素</p>

例如：

显示的结果：

块级元素 块级元素

块级元素会独自占据一行，也就是说紧跟他后面的元素会重新开始从下一行开始。

内联元素（inline）：不可以设置宽高，margin，padding值等；

<span>内联元素</span> <em>内联元素</em>

上面显示的结果

内联元素内联元素

从结果可以看出内联元素它会在一排显示，你设置它的宽高，margin，padding值都不起作用。

内联块元素(inline-block)：可以设置宽高，margin，padding值

< span >内联元素</ span > < em >内联元素</ em >

css：

span,em {  padding :  0 10 px ;  display : inline- block ;}

显示的结果是会在一排，但是同时宽高，margin，padding值也将起作用；

内联元素内联元素