Après avoir suivi, vous pouvez suivre ses informations dynamiques en temps opportun
Cours dans la section correspondante:JavaScript contrôle le style DIV
改变div样式 先做个DIV 给个ID。box 添加一个样式,width height background:red margin:20px 80px; 做6个按钮 button value值 高、宽、变色、重置 隐藏、显示 插入script
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> #box{ width: 100px; height: 100px;background:red;margin: 20px 80px; } </style> </head> <body> <div id="box"></div> <input type="button" value="变高" onclick="aa()"> <input type="button" value="变宽" onclick="bb()"> <input type="button" value="变色" onclick="cc()"> <input type="button" value="重置" onclick="dd()"> <input type="button" value="隐藏" onclick="ee()"> <input type="button" value="显示" onclick="ff()"> <script type="text/javascript"> var box window.onload=function(){ box=document.getElementById('box') } function aa(){ box.style.height="400px" //改变高度 } function bb(){ box.style.width="400px" //改变宽度 } function cc(){ box.style.background="pink" //改变颜色 } function dd(){ box.style.height="100px" //改变颜色 box.style.width="100px" box.style.background="red" } function ee(){ box.style.display="none" } function ff(){ box.style.display="block" } </script> </body> </html>
2019-01-050个赞