執行 ❯
建立您
自己的
網站
×
更改方向
儲存程式碼
更改主題,深色/淺色
前往 Spaces
<!DOCTYPE html> <html> <head> <style> #content { height: 100px; width: 100px; background-color: coral; padding: 15px; border: 10px solid black; margin: 10px; overflow: scroll; } </style> </head> <body> <h1>The Element Object</h1> <h2>The scrollHeight and scrollWidth Properties</h2> <button onclick="myFunction()">Adjust</button> <p>Click "Adjust" to set the width and height of "content" to the values returned from scrollHeight and scrollWidth.</p> <div id="content">Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..Some content..</div> <script> function myFunction() { const element = document.getElementById("content"); element.style.height = element.scrollHeight + "px"; element.style.width = element.scrollWidth + "px"; } </script> </body> </html>