<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> .box1 { width: 300px; height: 300px; padding: 100px; margin: 100px; position: relative; border: 100px solid #000; background-color: pink; } .box2 { width: 100px; height: 100px; background-color: red; /*position: absolute;*/ /*left: 10px;*/ /*top: 10px;*/ } </style> </head> <body> <div class="box1"> <div class="box3"> <div class="box2" style="left: 10px"></div> </div> </div> <script> var box2 = document.getElementsByClassName("box2")[0]; //offsetTop和offsetLeft console.log(box2.offsetLeft); console.log(box2.style.left); </script> </body> </html>
时间: 2024-10-11 20:36:32