<body>
<div style="display:inline">Box-1</div>
<div style="display:inline">Box-2</div>
<div style="display:inline">Box-3</div>
<span style="display:block">Box-4</span>
<span style="display:block">Box-5</span>
<span style="display:block">Box-6</span>
<div style="display:none">Box-7</div>
<span style="display:none">Box-8</span>
</body>
这样就把本来"块"div 变成"行"了
把"行"变成"块".
display:none是隐藏了当前行或块
显示的效果跟默认有差别,测试对比看看
对行内元素，需要注意如下：
•设置宽度width 无效。
•设置高度height 无效，可以通过line-height来设置。
•设置margin 只有左右margin有效，上下无效。
•设置padding 只有左右padding有效，上下则无效。注意元素范围是增大了，但是对元素周围的内容是没影响的