谁移动了我的画布?
本节讲述了在 !DOCTYPE 声明为 Internet Explorer 6 或更高版本打开符合标准的模式的情况下,BODY 和 HTML 元素的呈现方式有哪些区别。
在更早版本的 Internet Explorer 中,BODY 元素表示画布 — 文档内容可在其中呈现的整个表面。BODY 元素的大小不能更改,它等于窗口的大小。针对此元素设置的边距呈现在该元素的边框和滚动条之内。
从 Internet Explorer 6 开始,当您使用 !DOCTYPE 声明打开符合标准的模式时,BODY 元素可以从其内容获取其大小,也可以显式设置其大小 — Àý如,像 DIV 对象一样。在符合标准的模式中,HTML 元素表示画布。
当您打开符合标准的模式时,HTML 元素还会成为定位容器,用于那些没有定位父元素的定位元素。关闭符合标准的模式时的情况与更早版本的 Internet Explorer 一样,如果没有定位父元素,则会相对于 BODY 定位一个绝对定位元素。关闭符合标准的模式时,BODY 元素表示画布,这一点与更早版本的 Internet Explorer 也一样。
滚动条
SCROLL 属性会设置或检索一个值,该值指示是否打开元素的滚动条。对于 Internet Explorer 6 或更高版本,当您使用 !DOCTYPE 声明打开符合标准的模式时,此属性则会应用到 HTML 元素。符合标准的模式关闭时的情况与更早版本 Internet Explorer 一样,此属性应用于 BODY 元素,而不会应用于 HTML 元素。
注打开符合标准的模式时,可用于管理超过其容器大小的内容的overflow、overflow-x 和 overflow-y 属性会应用于 HTML 元素。
单独的背景
您可以为 HTML 和 BODY 元素指定单独的 background 属性。打开符合标准的模式时,两个背景会同时清楚呈现。这样有助于解决一个常见问题 — background 属性通常在 BODY 元素上定义,但是 BODY 具有默认边距,因此导致在 BODY 元素内容周围只会显示一个很窄的区域。
下面的示例说明了,当您对于 Internet Explorer 6 或更高版本在文档中使用 !DOCTYPE 声明打开符合标准的模式时,相同 HTML 元素如何以不同的方式进行呈现。HTML 元素具有红色背景,BODY 元素指定了高度和宽度。只有在打开符合标准的模式时,您才能看到这些属性的效果。没有打开符合标准的模式时,BODY 元素会充满该窗口,从而使您无法看到 HTML 元素的背景。当您单击该代码片段后面的按钮时,会启动一个带有两个 IFRAME 元素的文档。左侧 IFRAME 元素所指定文档包含的 !DOCTYPE 声明会为 Internet Explorer 6 或更高版本打开符合标准的模式。右侧 IFRAME 元素所指定文档包含的 !DOCTYPE 声明则不会打开符合标准的模式。右侧的 IFRAME 元素还显示了 DIV 元素在更早版本 Internet Explorer 中的呈现方式。
<head>
<title>Canvas Comparison</title>
</head>
<body style="background:blue; width:200px; height:150px">
<div style="background:yellow">Who moved my canvas?</div>
</body>
</html>
注打开符合标准的模式时,如果没有为 HTML 元素指定 background 属性,BODY 元素的 background 则会成为 HTML 元素的 background。这种情况符合 CSS2。
其他属性
本节讲述了 Internet Explorer 6 或更高版本中可用的两个 CSS 属性 — min-height 和 word-spacing。
min-height 属性
min-height 属性会设置或检索一个值,该值指定元素的最小高度。对于 Internet Explorer 6,此属性只应用于固定布局表中的 TD、TH 和 TR 元素。无论文档中的 !DOCTYPE 声明是否打开符合标准的模式,您都可以使用此属性。
元素的 height 默认情况下设置为 auto。使用此默认设置时,元素的高度会进行动态调整。您可以使用 min-height 属性来指定固定布局表中单元格或行的最小高度。
下面的代码片段显示了如何以声明的方式设置 min-height 属性。该固定布局表第一行的最小高度为 100 像素。
<tr style="min-height:100px">
<th>Row 1, Cell 1</th>
<th>Row 1, Cell 2</th>
</tr>
<tr>
<td>Row 2, Cell 1</td>
<td>Row 2, Cell 2</td>
</tr>
</table>
word-spacing 属性
word-spacing 属性从 Internet Explorer 4.01 开始可在 Macintosh 上使用。从 Internet Explorer 6 开始可在 Microsoft® Win32® 上使用。此设置会设置或检索元素中各个词之间附加间隔的数量。它会在每个词后面都添加一个指定数量的间隔,在这种情况下,可将某个词定义为 Internet Explorer 用来进行断行的标志 — 如空格或连字符。您可以在任何文本容器中设置此属性。
