学习css中遇到一个问题及解决方法

由于快期末了，老师要检查我们的jsp作业，所以不得不开始从头学起jsp；现在刚刚学到css，遇到了一些问题，但在我不断的尝试之下，总算解决了，这里列出一些例子：

有这样一个例子：

 css样式表：table.banner{
 background:url(banner1_bg.jpg) repeat-x;
 width:100%;
}
table.links{
 background:url(button1_bg.jpg) repeat-x;
 font-size:12px;
 width:100%;
}
a{
 width:80px; height:32px;
 padding-top:10px;
 text-decoration:none;
 text-align:center;
 background:url(button1.jpg) no-repeat; 
}
a:link{color:#654300;}
a:visited{color:#654300;}
a:hover{
 color:#FFFFFF;
 text-decoration:none;
 background:url(button2.jpg) no-repeat; 
}

其html代码为：

为了美观，我这样写的

<table cellpadding="0" cellspacing="0" class="links">
 <tr><td><a href="#">首页导读</a>
 <a href="#">在线用户</a>
 <a href="#">查询网友</a>
 <a href="#">在线好友</a>
 <a href="#">好友名单</a>
 <a href="#">查看讯息</a>
 <a href="#">发送讯息</a></td></tr>
</table>

效果是每个导航条在鼠标放上去的时候都有一段间隙，但是如果代码这样写：

 

<table cellpadding="0" cellspacing="0" class="links">
 <tr><td><a href="#">首页导读</a>
 <a href="#">在线用户</a><a href="#">查询网友</a> <a href="#">在线好友</a> <a href="#">好友名单</a><a href="#">查看讯息</a> <a href="#">发送讯息</a></td></tr>
</table>

间隙就可以消失，呵呵，其中还有类似的情况

如： <div  class=" "><img src="#" >

        </div>t图像下面会有一段间隙，消除的方法是：<div class=" "><img src=" #"></div>

有兴趣的朋友可以试试，呵呵，希望大家学习jsp的同学能互相帮助，少走弯路，希望大家常来我这里：