【发布时间】：2011-01-06 15:44:11
【问题描述】：
框模型中的背景指的是什么（内容、内边距、边框和边距）？
换句话说，如果我将盒子模型的哪个部分设置为绿色，它将被设置为显示背景颜色？
是否只是块元素（div、标题等）适用于盒子模型？内联元素（跨度、文本）也有填充、边框和边距吗？
【问题讨论】：
标签： css
【发布时间】：2011-01-06 15:44:11
【问题描述】：
这个小图表将演示一个框在浏览器中的显示方式：
box-chart http://img132.imageshack.us/img132/2692/boxchart.jpg
如您所见，边距是框本身与可能围绕它的任何内容之间的空间。边框只是框周围的一条线。内边距是盒子边缘和盒子内内容之间的空间。您设置的任何背景都将填充整个框（在边框内），但仍保持框周围的边距（空白区域）。
我相信几乎每个元素都可以使用边距、背景和边框。但是，某些元素不支持填充，除非它是块级的，因为它基本上与边距完全相同。您可以随时测试不同的样式，看看哪些有效，哪些无效，以及根据您设置的样式如何移动。
【讨论】：
元素完全占用，不包括边距占用的空间。您可以使用以下标记/css 进行测试：
.block { margin:5px; padding:0; width:25px; height:25px;
background-color:orange; float:left; }
<div class="block"></div>
<div class="block"></div>
渲染它，你会发现橙色框之间总共有 10 像素 - 我们的边距。
内联元素也有内边距和边距，但你不能总是以同样的方式使用它们，因为它们是内联的，而不是块级的。
【讨论】：