<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
window.onload=function(){
var oD=document.getElementById("w");
var oD1=document.getElementById("w1");
//alert("oD.clientWidth="+oD.clientWidth);//可视内容宽度 不包括border 滚动条的可视宽度
//alert("oD.offsetWidth="+oD.offsetWidth);//实际宽度 包括border 滚动条
//alert("oD.scrollWidth="+oD.scrollWidth);// 内容宽度
//alert("oD.clientHeight="+oD.clientHeight);
//alert("oD.offsetHeight="+oD.offsetHeight);
//alert("oD.scrollHeigth="+oD.scrollHeight);
alert("oD1.scrollHeight="+oD1.scrollHeight);//scrollHeight=542px; 因为内容实际宽度 由标签默认属性影响 margin padding等 多了32px；
};
</script>
<style>
#w{width:500px;height:500px;border:1px solid #ccc;overflow-x:scroll;/*margin:0 auto; opacity:0.5;*/float:left;}
#w p{width:510px;height:510px;display:block;background:red;}
#w1{height:auto;float:left;background:blue;}
#w1 p{height:510px;display:block;}
div,p{margin:0px;padding:0px;}
</style>
</head>
<body>
<div id="w">
<p>width:500px;height:500px;margin:0 auto;border:1px solid #ccc;</p>
</div>
<div id="w1">
<p>width:500px;height:500px;margin:0 auto;border:1px solid #ccc;</p>
</div>
</body>
</html>
时间： 2024-11-04 22:28:57