IE 盒模型

很多网站在写HTML的时候,没有指定DTD,也就是没有设置DOCTYPE。

上学的时候,老师说,DreamWeaver 生成的页面,头部的DOCTYPE都是垃圾信息,应该直接写成<html>。

学院派真是误人子弟……

W3C标准是要制定DOCTYPE的,最显著的区别,我认为就是IE显示Div等元素时采用的盒模型问题。

也就是说,对margin、border等样式所占的面积,是算在Div内部还是外部?

在设定DOCTYPE之前和之后,显示方式是完全不同的。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<style type="text/css">
#box    {
  width:720px;!important;    /* For Modern Browsers */
  width:704px;            /* For IE */
}
</style>

可以在

http://leakon.googlecode.com/svn/trunk/leakon/html/ie_box/

看到源码。

通过设置dtd参数,可以看到在两种DOCTYPE下显示方式的不同。

但在Firefox等现代浏览器下,两种显示方式是一样的。

Post a comment

Google

Google
LAMP-Linux-redhat LAMP-Apache LAMP-MySQL LAMP-Php Leakon-Wiki Leakon-BBS XueBaoBao Xyoyou