css+div 导航条问题~!
出现了点问题麻烦大家帮我分析分析。我准备做个导航条,这个导航条里一共有14个选项,而且这个导航条并不是一整条,而是一块一块的共14个块,也就是说是14张图组成。我的设计思...
出现了点问题麻烦大家帮我分析分析。
我准备做个导航条,这个导航条里一共有14个选项,而且这个导航条并不是一整条,而是一块一块的共14个块,也就是说是14张图组成。
我的设计思路是,分别建了14个css样式里面是背景图,分别在用14个li去引用这14个ID。(代码如下)只截取了导航条这块的代码。
问题来了:
在谷哥,火湖,IE8 浏览器里都很正常,但是在IE6 IE7里导航条上没有超链接(也就是说鼠标移动到导航条上不显示“小手”而且也不能点击它)
#top_7 ul {
float:left;
list-style:none;
}
#top_7 ul li{
float:left;
}
.top_7_1{
background:url(../QW/dao1.gif);
width:65px;
height:36px;
}
.top_7_2{
background:url(../QW/dao2.gif);
width:65px;
height:36px;
}
.top_7_3{
background:url(../QW/dao3.gif);
width:65px;
height:36px;
}
.top_7_4{
background:url(../QW/dao4.gif);
width:65px;
height:36px;
}
.top_7_5{
background:url(../QW/dao5.gif);
width:65px;
height:36px;
}
.top_7_6{
background:url(../QW/dao6.gif);
width:65px;
height:36px;
}
.top_7_7{
background:url(../QW/dao7.gif);
width:65px;
height:36px;
}
.top_7_8{
background:url(../QW/dao8.gif);
width:65px;
height:36px;
}
.top_7_9{
background:url(../QW/dao9.gif);
width:65px;
height:36px;
}
.top_7_10{
background:url(../QW/dao10.gif);
width:65px;
height:36px;
}
.top_7_11{
background:url(../QW/dao11.gif);
width:65px;
height:36px;
}
.top_7_12{
background:url(../QW/dao12.gif);
width:65px;
height:36px;
}
.top_7_13{
background:url(../QW/dao13.gif);
width:65px;
height:36px;
}
.top_7_14{
background:url(../QW/dao14.gif);
width:74px;
height:36px;
}
<div id="top_7">
<ul>
<a href="#" title="123"><li class="top_7_1"></li></a>
<a href="#" title="123"><li class="top_7_2"></li></a>
<a href="#" title="123"><li class="top_7_3"></li></a>
<a href="#" title="123"><li class="top_7_4"></li></a>
<a href="#" title="123"><li class="top_7_5"></li></a>
<a href="#" title="123"><li class="top_7_6"></li></a>
<a href="#" title="123"><li class="top_7_7"></li></a>
<a href="#" title="123"><li class="top_7_8"></li></a>
<a href="#" title="123"><li class="top_7_9"></li></a>
<a href="#" title="123"><li class="top_7_10"></li></a>
<a href="#" title="123"><li class="top_7_11"></li></a>
<a href="#" title="123"><li class="top_7_12"></li></a>
<a href="#" title="123"><li class="top_7_13"></li></a>
<a href="#" title="123"><li class="top_7_14"></li></a>
</ul>
</div 展开
我准备做个导航条,这个导航条里一共有14个选项,而且这个导航条并不是一整条,而是一块一块的共14个块,也就是说是14张图组成。
我的设计思路是,分别建了14个css样式里面是背景图,分别在用14个li去引用这14个ID。(代码如下)只截取了导航条这块的代码。
问题来了:
在谷哥,火湖,IE8 浏览器里都很正常,但是在IE6 IE7里导航条上没有超链接(也就是说鼠标移动到导航条上不显示“小手”而且也不能点击它)
#top_7 ul {
float:left;
list-style:none;
}
#top_7 ul li{
float:left;
}
.top_7_1{
background:url(../QW/dao1.gif);
width:65px;
height:36px;
}
.top_7_2{
background:url(../QW/dao2.gif);
width:65px;
height:36px;
}
.top_7_3{
background:url(../QW/dao3.gif);
width:65px;
height:36px;
}
.top_7_4{
background:url(../QW/dao4.gif);
width:65px;
height:36px;
}
.top_7_5{
background:url(../QW/dao5.gif);
width:65px;
height:36px;
}
.top_7_6{
background:url(../QW/dao6.gif);
width:65px;
height:36px;
}
.top_7_7{
background:url(../QW/dao7.gif);
width:65px;
height:36px;
}
.top_7_8{
background:url(../QW/dao8.gif);
width:65px;
height:36px;
}
.top_7_9{
background:url(../QW/dao9.gif);
width:65px;
height:36px;
}
.top_7_10{
background:url(../QW/dao10.gif);
width:65px;
height:36px;
}
.top_7_11{
background:url(../QW/dao11.gif);
width:65px;
height:36px;
}
.top_7_12{
background:url(../QW/dao12.gif);
width:65px;
height:36px;
}
.top_7_13{
background:url(../QW/dao13.gif);
width:65px;
height:36px;
}
.top_7_14{
background:url(../QW/dao14.gif);
width:74px;
height:36px;
}
<div id="top_7">
<ul>
<a href="#" title="123"><li class="top_7_1"></li></a>
<a href="#" title="123"><li class="top_7_2"></li></a>
<a href="#" title="123"><li class="top_7_3"></li></a>
<a href="#" title="123"><li class="top_7_4"></li></a>
<a href="#" title="123"><li class="top_7_5"></li></a>
<a href="#" title="123"><li class="top_7_6"></li></a>
<a href="#" title="123"><li class="top_7_7"></li></a>
<a href="#" title="123"><li class="top_7_8"></li></a>
<a href="#" title="123"><li class="top_7_9"></li></a>
<a href="#" title="123"><li class="top_7_10"></li></a>
<a href="#" title="123"><li class="top_7_11"></li></a>
<a href="#" title="123"><li class="top_7_12"></li></a>
<a href="#" title="123"><li class="top_7_13"></li></a>
<a href="#" title="123"><li class="top_7_14"></li></a>
</ul>
</div 展开
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询