第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定

為什么 offsetTop 是18px ,而 offsetLeft 是23px?

為什么 offsetTop 是18px ,而 offsetLeft 是23px?? 按理說應(yīng)該都是10+5+8=23px?。?/p>

還有就是為什么在body里面加overflow:hidden,不能清除浮動(dòng)呢?在div里加overflow:hidden,就可以清除浮動(dòng)。

<!DOCTYPE HTML>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script type="text/javascript">

? ? function req(){

? ? ? ? ? var div = document.getElementById("div1");

? ? ? ? ? document.getElementById("li1").innerHTML = (div.offsetTop)+"px";

? ? ? ? ? //div1距離屏幕頂部的距離

? ? ? ? ? document.getElementById("li2").innerHTML = (div.offsetLeft)+"px";

? ? ? ? ? //div1距離屏幕左部的距離

? ? ? ? ? document.getElementById("li3").innerHTML = (div.scrollTop)+"px";

? ? ? ? ? //div1縱向滾動(dòng)條滾動(dòng)的距離

? ? ? ? ? document.getElementById("li4").innerHTML = (div.scrollLeft)+"px";

? ? ? ? ? //div1橫向滾動(dòng)條滾動(dòng)的距離

? ? ?}

</script>

</head>

<body >

<div style="border:10px solid #ccc;padding:0px 0px;margin:5px 5px;overflow:hidden;">

? ? <div style="width:60%;border-right:1px dashed red;float:left;">

? ? ? ? <div style="float:left;">

? ? ? ? ? ? <div id="div1" style="border:5px red solid;height:300px;width:200px;overflow:auto">

? ? ? ? ? ? ? ? <div style="height:500px;width:400px">請(qǐng)調(diào)整橫豎滾動(dòng)條后,點(diǎn)擊按鈕后查看offsetTop、offsetLeft、scrollTop、scrollLeft值。</div>

? ? ? ? ? ? </div>

? ? ? ? ? ? <input type="button" value="點(diǎn)擊我!" onclick="req()" style="border: 1px solid purple;height: 25px;"/>

? ? ? ? </div>

? ? ? ??

? ? </div>

? ? <div style="width:30%;float:left;">

? ? ? ? <ul style="list-style-type: none; line-height:30px;">結(jié)果:

? ? ? ? ? ? <li>offsetTop : <span id="li1"></span></li>

? ? ? ? ? ? <li>offsetLeft : <span id="li2"></span></li>

? ? ? ? ? ? <li> scrollTop : <span id="li3"></span></li>

? ? ? ? ? ? <li>scrollLeft : <span id="li4"></span></li>

? ? ? ? </ul>

? ? ? ??

? ? </div>

</div>

? ? <!--<div style="clear:both;"></div>-->? ??

</body>

</html>


正在回答

3 回答

因?yàn)閎ody沒有 margin: 0; padding: 0;

0 回復(fù) 有任何疑惑可以回復(fù)我~

offsetTop和offsetLeft都是內(nèi)容以外到邊界的距離,border+margin+padding,也就是內(nèi)邊距加外邊距加邊框才是到內(nèi)容的距離,加入代碼

<style type="text/css">

*{

margin:0;

}

</style>

發(fā)現(xiàn),這是body自帶的margin外邊距是 0 8px,也就是左右加了個(gè)8而上下沒有加,上面的評(píng)論說明了,我只是詳細(xì)的說下

0 回復(fù) 有任何疑惑可以回復(fù)我~

css的基礎(chǔ),水平方向相鄰元素的外邊距為“之和”;垂直方向相鄰元素的外邊距會(huì)發(fā)生重疊,取其中最大值(你可以試著把margin:5px 5px修改成10px 5px,然后再觀察)。

而且討論這個(gè)沒意義,那個(gè)8px是瀏覽器自帶的,做項(xiàng)目都會(huì)重置樣式。

<link?>


0 回復(fù) 有任何疑惑可以回復(fù)我~

舉報(bào)

0/150
提交
取消

為什么 offsetTop 是18px ,而 offsetLeft 是23px?

我要回答 關(guān)注問題
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)