我的学习作业

Original 2019-03-12 22:04:42 241
abstract:<!DOCTYPE html> <html dir="ltr">   <head>     <meta charset="utf-8">     <title>控制DIV
<!DOCTYPE html>
<html dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>控制DIV</title>
    <style media="screen">
      div{width:50px;height:50px;background:red;}
    </style>

  </head>
  <body>
    <div id="div"></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()">
  </body>
  <script type="text/javascript">
    var box;
    window.onload=function(){
      box=document.getElementById('div');
    }
    function aa(){
      box.style.height="400px";
    }
    function bb(){
      box.style.width="400px";
    }
    function cc(){
      box.style.background="pink";
    }
    function dd(){
      box.style.width="50px";
      box.style.height="50px";
      box.style.background="red";
    }
    function ee(){
      box.style.display="none";
    }
    function ff(){
      box.style.display="block";
    }

  </script>
</html>


Correcting teacher:韦小宝Correction time:2019-03-13 09:14:40
Teacher's summary:写的很不错 使用JavaScript来控制div的样式可以做成动画一样的效果 使用起来时还是很有体验感的

Release Notes

Popular Entries