内联盒模型的典型模式如下：
复制代码
SELECTOR{
display:inline-block;
line-height:value;
overflow:value;
visibility:value;
width:value;
height:value;
margin:value;
padding:value;
border:width style color;
}
此设计模式可应用于所有的内联元素。
1.3块状盒模型
在块状格式化环境下，块状盒模型是竖直方向从上到下排列的，这是块状元素的正常排列顺利。块状盒模型可以包含其他的块状盒模型，或者它们可终结块状格式化环境，并开始一个包含内联盒模型的内联格式化环境。终端块状元素在其内盒里创建了一个内联格式化环境，但是它的外盒此时一定是处于块状格式化环境下。
块状元素的长度可以与它的父元素一致，也可以小于或大于它的父元素。当它的尺寸大于父元素的时候，它就会溢出来。overflow属性就是用来控制浏览器如何处理溢出的。在块状盒模型中，还是用width和height来设置元素的宽度与高度。其中，width:auto表示它使得元素的宽度与父元素一致，height:auto表示它使得元素的高度包裹住它的所以子元素。margin-left和margin-right会缩进或外延一个被拉伸的块状元素的两侧，它们会调整块状元素已设置的尺寸。margin-top和margin-bottom可以让不同块状元素之间的距离增大或减少，甚至可以让它们重叠。浏览器会抵消相邻块状元素的顶部和底部外边距。用margin-left:auto和margin-right:auto来控制已固定了尺寸的块状元素的水平排列。如果某个块状元素设置了width，margin-left:auto会令块状元素排列在父元素的右侧，margin-right：auto会令块状元素排列在父元素的左侧。而同时设定margin-left:auto和margin-right:auto会令块状元素位于父元素的中间。border和padding也会扩展盒模型的外宽和外高。块状盒模型的模式如下：
复制代码
SELECTOR{
display:block;
overflow:value;
visibility:value;
width:value;
height:value;
margin:value;
padding:value;
border:width style color;
}
此设计模式可用于所有块状元素。
1.4表格盒模型
表格是一个含有很多行单元格的块状盒模型。表格也位于块状元素的排列中，而表格中的单元格则被“行”和“列”来排列。表格有外边距但是没有内边距。单元格有内边距却没有外边距。用width设置表格的宽度，这里的width指边框外围的宽度而不是内边距里面的宽度。用height设置表格的高度，这里的height指边框外围的高度而不是内边距里面的高度。margin的解析方式根据表格是否被设定了尺寸、包裹或者拉伸来决定的。当它被固定了尺寸和包裹时，外边距会移动表格和接下来的元素。负的外边距则会令相邻元素与表格重叠。当表格被拉伸时，外边距会令表格缩进，这会令它的内部尺寸变小并缩小单元格的大小。border会令已定义了尺寸或拉伸的表格的内盒变小。而overflow不能应用于表格，因为表格是不能溢出的，只有表格的单元格能溢出。应把overflow:hidden赋给单元格，以确保当固定了尺寸的单元格溢出时，所有浏览器的行为是一致的。Border-collapse决定了邻近的边框是否合并为一个，table-layout决定了表格是固定大小（fixed）还是依据其内容而变动的（auto）。表格盒模型的模式如下：
