HTML-扫雷1--隐藏小格的背景色

将大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>

 

posted @ 2015-08-28 11:29  嘿,我在!  阅读(230)  评论(0)  编辑  收藏  举报