Question

css+div 导航条问题~！

出现了点问题麻烦大家帮我分析分析。
我准备做个导航条，这个导航条里一共有14个选项，而且这个导航条并不是一整条，而是一块一块的共14个块，也就是说是14张图组成。

我的设计思路是，分别建了14个css样式里面是背景图，分别在用14个li去引用这14个ID。（代码如下）只截取了导航条这块的代码。

问题来了：在谷哥，火湖，IE8 浏览器里都很正常，但是在IE6 IE7里导航条上没有超链接（也就是说鼠标移动到导航条上不显示“小手”而且也不能点击它）

#top_7{
padding-top:120px;
padding-left:400px;
width:1000px

#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>

Answer 1

<a href="#" title="123"><li class="top_7_1"></li></a>

改成
<li class="top_7_1"><a href="#" title="123"></a></li>
再试试呢

Answer 2

A标签里是不可以嵌套标签的，你应该把LI放到外面来 而且ul 下只有li和ol 你这么做是不对的

Answer 3

哥们 ， 你写反了
<a href="#" title="123"><li class="top_7_14"></li></a>

改成
<li class="top_7_1"><a href="#" title="123"></a></li>

Answer 4

把<a>标签加在<li>标签里面。然后再CSS里面把a{display:block;}

Answer 5

这个样式都没什么错，就是div里面写的有问题，每个列表项都是用li来引的，你为什么不把超链接标记写在<li></li>标记里呢，放到里面试试，肯等没问题...