请教一个关于DIV布局的问题,我的代码如下:
<%--<!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">
<head runat="server">
<title>无标题页</title>
<style>
body
{
overflow:hidden;
font-size:9pt;
} #navi{
width:100%;height:25px;
border-left:1px solid #8295C0;
padding:6px 0 0 25px;
color:#FFFFFF;
font-weight:bold;
background-color:Aqua;
}
#context{
width:100%;
overflow:auto;
} #scroll_header{
width:100%;
overflow:hidden;
height:30px;
background-color:Blue;
}
#scroll_data{
width:100%;
overflow:auto;
/*Moved from the html's element which id is scrool_data*/
background-color:GrayText;
}
#buttons{
width:100%;
background:#4D69A6;
border-left:1px solid #8295C0;
text-align:right;
padding:3px 5px;
height:30px;
}
</style> <script>
function initdiv(){
$("context").style.height=document.body.clientHeight-$("navi").offsetHeight-$("buttons").offsetHeight;
$("scroll_data").style.height=$("context").offsetHeight-$("query").offsetHeight-$("scroll_header").offsetHeight-32;
} function $(ObjID){
return document.getElementById(ObjID);
}
</script></head>
<body onload="initdiv();">
<form id="form1" runat="server">
<div id="navi">
>>导航栏
</div>
<div id="context">
<div id="query">
查询
</div>
<div id="scroll_header">
列标题
</div>
<div id="scroll_data">
数据<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
</div>
</div>
<div id="buttons">
按钮
</div>
</form>
</body>
</html>被我注释掉的是W3C的标准,这样的文件能正常显示,但是如果不注释掉W3C标准的话,页面就不能正常显示的,如果加上W3C的标准,怎么才能让页面正常显示?
如果你非要选用你注视掉的标准,
就改代码为规范的XHTML 1.0 标准,详细标准可以网上查到。
我们公司现在用更严格的标准,呵呵
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
这样的不太对吧,w3c里面不可以这样写的,我以前写了,似乎不起作用width:auto; 这样试试