选项卡

图片要自己添加

<html>

<head>

<title></title>
<style type="text/css">

a{
text-decoration : none ;
background:url(MenuBg.gif) ;
width : 99px ;
height : 29px ;
padding-top : 8px ;
padding-left : 10px ;
border : 0px ;
lihe-height:3px;

}
a:hover{text-decoration : none ;
background:url(MenuBg.gif) ;
width : 99px ;
height : 29px ;
padding-top : 8px ;
padding-left : 10px ;
border : 0px ;
lihe-height:3px;}
.width{ width : 800px ;}
</style>

<script type="text/javascript">
function show(id){
var arr=document.getElementsByTagName("img");
for(var i=0;i<arr.length;i++){
    if(i==(id-1)){
        arr[i].style.display='block';
    }
    else{
         arr[i].style.display='none';
    }
    
}
}
</script>
</head>

<body>
<center>
<table class="width">
<tr>
    <td><a href="#" οnmοuseοver="show(1)">qq专区</a></td> 
     <td><a href="#" οnmοuseοver="show(2)">时尚饰品</a></td>
       <td><a href="#" οnmοuseοver="show(3)">1元专区</a></td>
         <td><a href="#" οnmοuseοver="show(4)">彩妆</a></td>
</tr>
<tr>
    <td colspan="4">
    <img src="pic1.jpg" width="750px" height="574px"/>
    <img src="pic2.jpg" width="750px" height="574px" style="display:none"/>
     <img src="pic3.jpg" width="750px" height="574px"  style="display:none"/>
      <img src="pic4.jpg" width="750px" height="574px" style="display:none"/>
    </td>
</tr>
</table>
</center>
</body>

</html>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值