文章详情页
css - 关于offsetLeft和offsetTop
问题描述
offsetLeft不是当前元素的左外边框到包含元素的左内边框之间的像素距离吗？为什么多出了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 指的是一个元素最近的父级定位元素，如果没有定位元素就是文档根节点。
你现在输出的值加上 body 本身有 8px 的 margin，其实是没错的。你可以加个 body { margin:0 } 或者给父级元素加上定位，输出就是你期望的数了。
回答2：默认有8px的margin。使用*{margin:0;}清除默认样式。
标签：
CSS
相关文章：
1. css3 - css字体样式加填充色而不是背景色2. javascript - 小白求解:mac 下如何设置nodejs express的 NODE_NEV 环境变量3. Python如何考虑代码注入安全？4. html5 - 目前 公司App 嵌入H5页面 做个 手机支付功能 没有做过 所以 请求各位有经验的 给个思路5. css3中translate(-50%,-50%)对 transform-origin的奇葩影响？6. 安装sublime text 3 控制台的时候出现这个报错怎么办？7. 前端 - 请教一下CSS3中translateZ和rotateY书写顺序的问题8. javascript - 请问一下react-native 布局的时候，尺寸的大小是如何确定的呢？9. html5 - vue-cli 装好了 新建项目的好了，找不到项目是怎么回事？10. javascript - jQuery中live事件在移动微信端下没有效果；代码如下
排行榜
网公网安备