文章詳情頁
css - 關(guān)于offsetLeft和offsetTop
瀏覽：184日期：2023-01-15 09:22:10
問題描述
offsetLeft不是當(dāng)前元素的左外邊框到包含元素的左內(nèi)邊框之間的像素距離嗎？為什么多出了8px
<!DOCTYPE html><html> <head><meta charset='utf-8'><title>test2</title><style media='screen'> .cc{padding: 50px 30px; } .fc{background-color: blue;width:300px;height: 200px; }</style> </head> <body><p class='cc'> <p > </p></p> </body> <script type='text/javascript'>var fc = document.querySelector(’.fc’);console.log(fc.offsetLeft+’:’+fc.offsetTop); </script></html>
問題解答
回答1：offsetLeft 和 offsetTop 返回的是相對于 offsetParent 元素的距離，而 offsetParent 指的是一個元素最近的父級定位元素，如果沒有定位元素就是文檔根節(jié)點。
你現(xiàn)在輸出的值加上 body 本身有 8px 的 margin，其實是沒錯的。你可以加個 body { margin:0 } 或者給父級元素加上定位，輸出就是你期望的數(shù)了。
回答2：默認(rèn)有8px的margin。使用*{margin:0;}清除默認(rèn)樣式。
標(biāo)簽：
CSS
相關(guān)文章：
1. mysql - 記得以前在哪里看過一個估算時間的網(wǎng)站2. python中merge后文件莫名變得非常大3. 希望講講異常處理4. css3 - 純css實現(xiàn)點擊特效5. docker start -a dockername 老是卡住，什么情況？6. javascript - 關(guān)于<a>元素與<input>元素的JS事件運行問題7. java - 為什么第一個線程已經(jīng)釋放了鎖，第二個線程卻不行？8. css3 - [CSS] 動畫效果 3D翻轉(zhuǎn)bug9. javascript - 如何將一個div始終固定在某個位置；無論屏幕和分辨率怎么變化；div位置始終不變10. 大家好，我想請問一下怎么做搜索欄能夠搜索到自己網(wǎng)站的內(nèi)容。
排行榜
熱門標(biāo)簽
網(wǎng)公網(wǎng)安備