前述：一个页面中图片与图片之间出现水平空隙，效果如图
代码部分如下：
<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
}
修复后的效果图：
分享到：
赞一个，解决了问题
赞一个。
相关推荐
#### 其他可能的原因及解决办法 除了上述提到的方法外，还有一些其他的因素也可能导致图片周围的空隙问题： - **图片自身的CSS样式**：有时候图片自身定义了一些额外的CSS样式，比如 `margin`、`padding` 等，这些都...
在网页设计中，图片元素(img)的布局是一个常见的任务，而有时我们可能会遇到两个或多个图片换行排列时出现空隙的问题。这个问题主要是由于浏览器默认的行内元素对齐方式导致的。`<img>`标签在HTML中被定义为行内元素...
解决这个问题的方法有很多种，以下是几种常见的解决方案： 1. **浮动元素**：将`<li>`元素设置为浮动元素，如`float:left;`，这样可以消除上下文的影响，但需要注意清除浮动以防止布局问题。 ```css li { float: ...
网页之间的空隙我们一般用空格表示，因为手机中不会说文字之间有太大的距离，所以一般用空格" "表示，或者 margin 和 padding 值也可以用，但最好不要超过。 手机网页设计需要考虑到很多因素，如屏幕大小、...
总结来说，解决`<li>`中`<img>`图片间空隙的问题，可以采用调整`vertical-align`属性或者设置`font-size: 0`的方法。具体选择哪种方案，应根据实际项目的需求和结构来确定。在实际开发中，可能还需要考虑浏览器兼容...
在网页设计中，有时会遇到一个常见的问题，即图片（img）与包含它的容器（通常是div）之间的下边界出现空隙或缝隙。特别是在Internet Explorer 7（IE7）浏览器中，这种现象尤为突出，而在更新的浏览器如IE8中则不太...
默认情况下，这些值通常不是0，导致图片之间出现空隙。 #### 二、解决方案 为了避免图片间的空隙，我们需要设置表格的相关属性为0，具体步骤如下： 1. **定义表格**：在HTML代码中定义表格时，需要指定`border`、...
在网页设计中，使用CSS布局时，经常遇到一个问题，那就是元素之间的间距问题，特别是当横排展示多张图片时，图片之间可能会出现不期望的缝隙。这个问题在标题和描述中被提到，即“怎样去掉横排图片之间的间距”。...
这是因为数字图像由像素组成，当图像被放大，像素之间的空隙被填充，如果简单地增加像素数量，可能会导致图像变得模糊或出现马赛克效果。为了解决这个问题，专业的图像处理软件采用了各种算法来优化放大过程。 ...
在网页设计中，有时会遇到一个常见的问题，即图片在`div`容器内与下边框之间存在3个像素的额外间距，这被称为"3像素bug"。这个问题通常是由于浏览器的渲染机制导致的，尤其是在处理行内元素如`img`标签时。下面我们...
**解决方法**：有多种解决方案，包括调整源代码格式、修改图片的`display`属性、设置`vertical-align`以及使用`overflow:hidden`。 1. **源代码调整法**：确保`</div>`和`<img>`在同一行。 2. **Block Display法**...
9. **IE6-7图片下有空隙问题**： 可以通过让`</div>`与`<img>`在同一行、设置`display:block;`、`vertical-align:top/middle/bottom;`、`overflow:hidden;`或`float:left;`来消除图片下方的空隙。 10. **IE6双倍...
实现列表项的横向排列时，确保代码书写紧凑，避免不必要的空白字符，使用`float:left`结合`margin:0`或`padding:0`可以有效去除列表之间的空隙。 ### 总结 学习和掌握DIV+CSS不仅是一门技术，更是一种艺术。从命名...
2. **解决办法：** 明确设置元素的`height`属性，尤其是对于需要固定高度的容器，这有助于避免此类问题的发生。 #### 四、兼容各个浏览须注意，默认设置行高可能是杀手 **知识点：** 1. **行高（line-height）：** ...
掌握这些CSS速记口诀，可以在遇到问题时迅速找到解决办法，提高开发效率，同时也能使代码更加整洁，增强浏览器兼容性。通过不断练习和理解CSS的底层原理，设计师和开发者能够更自如地驾驭CSS，创造出优秀的网页布局...
+ `height`：图片高度，设置宽高时，图片可能变形，解决方法：设置宽或高，让图片等比例。 + `border`：图片边框。 HTML 音频标签 ------------- * `<audio>`：音频标签，播放音频。 * 属性： + `src`：音频...
2 <br>0003 设置程序代码行序号 3 <br>0004 开发环境全屏显示 3 <br>0005 设置窗口的自动隐藏功能 3 <br>0006 根据需要创建所需解决方案 4 <br>0007 如何使用“验证的目标架构”功能 4 ...
- `gap`：元素之间空隙的像素值。 - `delayBeforeStart`：滚动开始前的延迟时间。 - `direction`：滚动方向，可以是`up`（垂直向上）、`down`（垂直向下）、`left`（水平向左）或`right`（水平向右）。 - `...
8. **img标签后的空白字符**：在Firefox和IE7中，img标签后的空白字符会导致图片底部与容器底部之间有空隙。消除此问题的方法是确保img标签直接闭合或设定`display:block`。 9. **失去line-height效果**：在IE6下，...