关于dtd对html显示的影响

不喜欢吃素的菜鸟 发布于 2013/08/26 12:05
阅读 222
收藏 0

-- 显示不正常
-- 1.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
-- 2.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-- 显示正常
-- 1.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>靠,你妹的浏览器</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
    <div style="height: 100%; width: 100%; background-color: #ccc; overflow: scroll;">
        <div style="width: 100%; height: 100%; border: 10px double red;">
        
        </dvi>
        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    </div>
</body>
</html>



-- 显示正常
-- 该dtd中,将第1个子div的width、height置成500px;第2个div的width、height设置成100%;
-- 1.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-- 2.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
-- 3.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>靠,你妹的浏览器</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
    <div style="height: 500px; width: 500px; background-color: #ccc; overflow: scroll;">
        <div style="width: 100%; height: 100%; border: 0px double red; background: green;">
        
        </dvi>
        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    </div>
</body>
</html>


经常需要显示数据,类似于上面一些查询条件,下面一个表格。
主要是在ie6显示,jquery插件出现了各种问题。所有的数据要在浏览器的可见区域显示,不能出现滚动条。真是各种苦逼。

以前没怎么注意:
document.documentElement.nodeName; // 输出HTML
document.body.nodeName; // 输出BODY
// document.documentElement.offsetHeight 很多时候和 document.body.offsetHeight 不相等。




加载中
返回顶部
顶部