<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
*{
margin: 0;
padding: 0;
/*box-sizing: border-box;*/
}
.a{
width: 100px;
height: 100px;
background-color: red;
/*margin:30px;*/
padding: 30px;
border:30px solid #969696;
}
</style>
</head>
<body>
<section id = ‘s‘class="a"></section>
<script type="text/javascript">
alert(‘clientWidth:‘+document.getElementById("s").clientWidth);
alert(‘clientHeight:‘+document.getElementById("s").clientHeight);
alert(‘offsetWidth:‘+document.getElementById("s").offsetWidth);
alert(‘offsetHeight:‘+document.getElementById("s").offsetHeight);
alert(‘scrollWidth:‘+document.getElementById("s").scrollWidth);
alert(‘scrollHeight:‘+document.getElementById("s").scrollHeight);
alert(‘scrollTop:‘+document.getElementById("s").scrollTop);
alert(‘scrollLeft:‘+document.getElementById("s").scrollLeft);
alert(‘screenTop:‘+window.screenTop);
alert(‘screenLeft:‘+window.screenLeft);
alert(‘screen.height:‘+window.screen.height);
alert(‘screen.width:‘+window.screen.width);
alert(‘screen.availHeight:‘+window.screen.availHeight);
alert(‘screen.availWidth:‘+window.screen.availWidth);
</script>
</body>
</html>
时间： 2024-12-29 10:51:46