img之间有空隙的问题
来源:互联网 发布:建材软件 编辑:程序博客网 时间:2024/05/03 00:22
图片间有空隙的解决方法
定制页面时遇到图片间有空隙的问题,google:
在li中纯放图片img,出现的bug是图片之间有3px的间隙,给li加高度也无效,解决图片间有空隙方法如下:
直接加样式img{vertical-align:bottom; display:block}
当然在某些情况下无效,比如我要加三个图片,上中下,中间的图片是设为背景,发现用此方法无效,只是上和中的图片空隙没了,而下与中之间还存在,方法很简单,把vertical-align:bottom改成top,可根据自己遇到的不同情况来设vertical-align的参数
方法一:img{vertical-align:top; display:block}
<style>
#l1 {float:left;background:#000;}
#l1 ul li
{list-style:none;padding:0;margin:0}
img {vertical-align:bottom;
display:block;}
</style>
<div id="l1">
<ul>
<li><img src="" /></li>
<li><img src="" /></li>
<li><img src="" /></li>
<li><img src="" /></li>
</ul>
</div>
方法二:设置容器font-size:0
0 0
- img之间有空隙的问题
- 两个img之间有空隙
- HTML,用表格单元格放置图片 <img>,</td><td>之间的回车会使得图像之间有空隙
- HTML5 -img video flash等 在table 的td中有空隙问题
- IMG与元素边界有空隙问题分析及解决
- css img周围有空隙
- 去除img图片之间的空隙css样式
- 网页图片之间有空隙的解决办法
- 图片IMG与容器下边界有空隙的解决方法
- 图片IMG与容器下边界有空隙的解决方法
- <li><img>图片间有空隙的解决方法
- 解决img标签空隙问题
- css解决图片之间的空隙问题
- <li><img>标签之间空隙解决办法
- Android layout之间有空隙
- 两个div之间有空隙的起源和解决方法
- 解决网页图片之间有空隙的方法
- 淘宝里table中tr之间有空隙的解决方法
- 安卓开发之简单的短信操作模块
- python sort和sorted使用详解
- mysql 时间类型 timestamp和datetime
- 最长递增子序列(O(nlogn))
- NGUI 圆形遮罩列表(scrolview+grid+item)
- img之间有空隙的问题
- 笔试真题解析 ALBB-2015 校招研发在线笔试题
- mongodb的高级查询
- (总结)Web性能压力测试工具之WebBench详解
- 设计模式之装饰模式
- HDU 2046 骨牌铺方格
- 浅析深究什么是中间件
- 1098
- AppDelegate