css - 使用 css ul li 显示内联 block 时出现的像素

Question

图像非常不言自明。我无法摆脱只有一个列表元素底部的那两个像素。我在 css 的每个 Angular 落都插入了 text-decoration:none 和 list-style-type none 但没有结果。 原因？

http://s1089.photobucket.com/user/3Joez/media/disp_zps6fe2774c.jpg.html

#rightnav {
float:right;
width:65%;
height:50px;
/*border:2px solid #Df1;*/
}

#rightnav ul {
 margin-left:9.5%;
/*border:1px solid #F30;*/
width:500px;

}

#rightnav ul li {

 display:inline-block;
 font-family:Times New Roman, Times, serif;
 font-size:1.4em;
 margin-left:2%;
 margin-top:1.5%;
 color:#FFF;
 text-decoration:none ;
 list-style:none; 
 list-style-type:none;

Answer 1

很确定你有一个 <a>在你的里面 <li> .您是否更改了上面的文字装饰？在 <li> 上更改它可能不会更改内部样式，因为 UA CSS 可能会将下划线样式绑定(bind)到 <a>标签。

#rightnav ul li a {
  text-decoration:none;
}