在框内部完成一切任务
本节讲述了当您使用 !DOCTYPE 声明打开符合标准的模式时，Internet Explorer 6 或更高版本计算元素的 width 和 height 属性的方式，还讲述了这种方式与更早版本 Internet Explorer 属性计算方式的区别。
CSS1 框模型将内容定义在一个 HTML 元素中，就好像它周围有一个不可见的矩形边框一样。这个边框周围有三个矩形地带，分别以 margin、border 和 padding 属性表示。您可以使用样式表来对该边框及其周围地带的大小和外观进行操作。
更早版本的 Internet Explorer 计算 width 和 height 属性的方式不遵守 CSS1 框模型。在 CSS1 中，width 属性定义为元素内容周围左边框和右边框之间的距离。与之相似，height 属性在 CSS1 中则定义为上边框和下边框之间的距离。然而，对于更早版本的 Internet Explorer，width 和 height 属性还包括该元素边框周围的 border 和 padding 地带。下图说明了这个区别。
图 1. Internet Explorer 6 与更早版本间 width 和 height 属性计算方式的区别的图示说明
符合的行为
对于 Internet Explorer 6 或更高版本而言，当您使用 !DOCTYPE 声明打开符合标准的模式时，width 和 height 属性分别指定左、右边框，以及上、下边框之间的距离。不包括 border 和 padding 地带。
不符合的行为
当 !DOCTYPE 声明没有打开符合标准的模式时，正如更早版本的 Internet Explorer 一样，width 属性包括该对象的内容框，加上下列属性的值：border-left、border-right、padding-left 和 padding-right。width 属性值减去这些属性值的和，等于父对象内容框的宽度。与之相似，height 属性值减去 border-top、border-bottom、padding-top 和 padding-bottom 属性值的和，等于父对象内容框的高度。
框模型示例
本节中的示例说明了，当您对于 Internet Explorer 6 或更高版本在文档中使用 !DOCTYPE 声明打开符合标准的模式时，相同 HTML 元素是如何以不同方式呈现的。
下面 HTML 代码片段中 DIV 元素的 width 和 height 均为 200 像素，border-width 为 50 像素。当您单击该代码片段后面的按钮时，会启动一个带有两个 IFRAME 元素的文档。左侧 IFRAME 元素所指定文档包含的 !DOCTYPE 声明会为 Internet Explorer 6 或更高版本打开符合标准的模式。右侧 IFRAME 元素所指定文档包含的 !DOCTYPE 声明则不会打开符合标准的模式。右侧的 IFRAME 元素还显示了 DIV 元素在更早版本 Internet Explorer 中的呈现方式。
＜div style="width:200px; height:200px;
border-width:50px; border-style:solid"＞
Hi kids. Daddy will be home soon. I love you both!
＜/div＞
TABLE 元素
对于更早版本的 Internet Explorer，CSS1 框模型语义用于计算自动布局表中 TD 和 TH 元素的 width 属性，但是不用于计算这些元素的 height 属性。在更早版本的 Internet Explorer 中，固定布局表不使用 CSS1 语义。
注默认情况下为自动布局表。要创建固定布局表，请将TABLE 元素的 table-layout 属性设置为 fixed。固定布局表的优点在于，它们的呈现速度比自动布局表的呈现速度快。
IMG 元素
CSS1 框模型语义在更早版本的 Internet Explorer 中还用于计算 IMG 元素的 width 和 height 属性。但是，padding 不适用于更早版本 Internet Explorer 中的 IMG 元素。
