client系列

编辑本博客

  • clientTop:顶部边框宽度
  • clientLeft:左边边框宽度
  • clientWidth:内容区域+左右padding区域,即可视宽度
  • clientHeight:内容区域+上下padding区域,即可视高度
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>client系列</title>
    <style type="text/css">
        .box{
            width: 200px;
            height: 300px;
            position: absolute;
            border: 1px solid seagreen;
            margin: 10px 0px 0px 0px;
            padding: 10px;
        }
    </style>


</head>
<body>
<div class="box"></div>
</body>
<script type="text/javascript">
    var box=document.getElementsByClassName('box')[0];
    console.log(box.clientTop);
    console.log(box.clientLeft);
    console.log(box.clientWidth);
    console.log(box.clientHeight);
</script>
</html>
View Code

 

posted @ 2018-06-17 10:35  丫丫625202  阅读(189)  评论(0编辑  收藏  举报