`

网页图片之间有空隙的解决办法

    博客分类：
  • CSS
htmlcssjspimg 
阅读更多

前述：一个页面中图片与图片之间出现水平空隙，效果如图

 

 

代码部分如下：

 

<table width="980" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td>
			<img src="images/top.jpg" width="980" height="90" border="0" usemap="#Map" />
		</td>
	</tr>
</table>

<map name="Map" id="Map">
	<area shape="rect" coords="706,39,742,57" href="common/center.jsp"
		target="main" />
	<area shape="rect" coords="791,44,827,61" href="common/help.jsp" />
	<area shape="rect" coords="875,48,910,66" href="login.jsp" />
</map>

<table width="980" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td>
			<img src="images/top_2.jpg" width="980" height="68" border="0" />
		</td>
	</tr>
</table>

 也尝试过<td><img>之间没有任何字符，以及在<img>标签加上 align="bottom"属性的写法，还是不行。最后解决的方法是在<head></head>之间插入img的css

 

代码如下：

 

/*设定图片样式，垂直对齐，解决了图片图片之间含有空隙的情况 2011.07.27 added by Lee.will*/
img {
	vertical-align: bottom
}

 修复后的效果图：

 

分享到：
| 将解压版的Tomcat作为系统服务启动
评论
2 楼 dlb415519095 2012-04-06  
赞一个，解决了问题
1 楼 wulaiyatou 2011-12-02  
赞一个。
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics