首页js设置css样式示例

js设置css样式示例

时间: 2023-10-01 08:05:52 浏览: 94

好的，请看下面的代码示例： ```html <!DOCTYPE html> <html> <head> <title>JS设置CSS样式示例</title> <style> .demo { width: 100px; height: 100px; background-color: #f00; } </style> </head> <body> <div id="demoDiv" class="demo"></div> <script> var demoDiv = document.getElementById("demoDiv"); demoDiv.style.width = "200px"; demoDiv.style.height = "200px"; demoDiv.style.backgroundColor = "#0f0"; </script> </body> </html> ``` 以上示例中，我们通过 JavaScript 获取了 id 为 "demoDiv" 的元素，然后利用 .style 属性来修改该元素的 CSS 样式。具体来说，我们通过设置 .style.width 和 .style.height 属性改变了元素的宽度和高度，通过 .style.backgroundColor 属性改变了元素的背景颜色。

阅读全文