学习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的同学能互相帮助，少走弯路，希望大家常来我这里：