下划线取消不了···

Question

做了一个CSS+DIV的模型，但里面span标签内的下划线取消不了···

代码如下：
html:
<div class="navs">

   <span class="summarize"><b>项目概况</b></span>
   <ul>
      <li id="five"><a href="#">手术类</li>
      <li id="five"><a href="#">代孕类</li>
      <li id="five"><a href="#">产品类</li>
      <li><a href="#">口腔整形类</li>
      <li><a href="#">···类</li>
      <li><a href="#">皮肤管理类</li>
      <li><a href="#">···类</li>
   </ul>
</div>

css:
.summarize{
height:28px;
width:100%;
margin:0px;
color:#6633CC;
display:block;
font-size:24px;
text-decoration:none;
}

five{

width:33%;
}
.navs{
height:200px;
width:40%;
float:left;
}
.navs ul{
margin:0px;
padding:0px 0px 0px 0px;
list-style:none;
}
.navs ul li{
float:left;
width:49.5%;
height:50px;
margin:0px;
padding:5px 0px 0px 0px;
text-align:center;
background:#CECEFF;
border:1px solid #FFFFFF;
}
.navs ul li a{
margin:0px;
font-size:36px;
text-decoration:none;
}
.navs ul li:hover{
color:#6633CC;
background:#5959FF;
}
先谢过各位大佬了(・∀・(・∀・(・∀・*)

Answer 1

目测应该是border或border-bottom的原因，你可以用浏览器调试一下，如果是的话，改就border：0就行了

Answer 2

text-decoration:none后面加个!important呢

Answer 3

你加b标签干嘛，用font-weight:bold不就行了

Answer 4

从你的代码来看，<span class="summarize">项目概况</span> 根本不可能有下划线
你应该还引入了其他css文件，在浏览器里审查一下就知道了。

补充一下：
这是写的什么破代码，能不能有点规范？ id重复，标签不写结束标签

Answer 5

在浏览器中先看一下，这条下划线是什么引起的，边框还是下划线？ 直接在浏览器中改下样式更方便。。

Answer 6

在hover里加text-decoration:none应该可以

Answer 7

……虽然不知道为什么，但是加了个浮动后线就没了_(:з」∠)_