将大DIV设背景图片,小DIV设背景颜色并设置触发的事件(当点击小DIV时它的背景颜色变为透明)
<head> <title>无标题文档</title> <style type="text/css"> * { margin:0px auto; padding:0px; } #a1 div { width:100px; height:100px; background-color:#09F; border:1px solid black; float:left; } #a1 { width:410px; height:410px; background-image:url(../../../Pictures/1437459768106.jpg); } </style> </head> <body> <div id="a1"> <div id="aa1" onclick="pic(this)"></div> <div id="aa2" onclick="pic(this)"></div> <div id="aa3" onclick="pic(this)"></div> <div id="aa4" onclick="pic(this)"></div> <div id="bb1" onclick="pic(this)"></div> <div id="bb2" onclick="pic(this)"></div> <div id="bb3" onclick="pic(this)"></div> <div id="bb4" onclick="pic(this)"></div> <div id="cc1" onclick="pic(this)"></div> <div id="cc2" onclick="pic(this)"></div> <div id="cc3" onclick="pic(this)"></div> <div id="cc4" onclick="pic(this)"></div> <div id="dd1" onclick="pic(this)"></div> <div id="dd2" onclick="pic(this)"></div> <div id="dd3" onclick="pic(this)"></div> <div id="dd4" onclick="pic(this)"></div> </div> </body> <script type="text/javascript"> function pic(a) { a.style.opacity="0"; } </script>
时间: 2024-10-29 19:11:47