用CSS解决图片下面有空隙的方法

日期：2007年10月8日作者：查看:[大字体中字体小字体]

在用CSS制作网页过程中可能会碰到图片下面有空隙的问题，本文给出了最为简单的解决方法。解决方法：在图片的css中加 vertical-align:bottom; 效果



演示代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>解决图片下有空隙</title>
</head>
<body>
<style>
*{margin:0px;padding:0px;}
#l1 {float:left;background:#000;padding:20px;margin:50px;}
#l1 ul li {list-style:none;}
#l1 ul li img {vertical-align:bottom; display:block;}
</style>
<div id="l1">
   <ul>
    <li><img src="图片地址1" /></li>
    <li><img src="图片地址2" /></li>
    <li><img src="图片地址3" /></li>
    <li><img src="图片地址4" /></li>
   </ul>
</div>
</body>
</html>
（出处：急速软件下载学院）
用CSS解决图片下面有空隙的方法相关文章：
·PS IR打造小仙女魔法之水果变变变
·Windows Vista停止报告程序问题的技巧方法
·Photoshop字体安装使用方法和技巧
·QQ常在异地登录的原因及其应对方法
·Vista系统无法开启打印机共享怎么办？
·不再怕电脑病毒电脑中毒后的6招处理方法
·用JavaScript刷新框架子页面的方法
·网页排名靠前网页标题写法
·加快Windows Vista系统窗口打开速度的方法
·防范黑客攻击Oracle系统的八大常用方法
用CSS解决图片下面有空隙的方法相关软件
·《苍天》双手大刀操作方法介绍视频
·《苍天》偃月刀操作方法介绍视频
·做人做事好方法
·商界成功者最推崇的成事法则：先做人后做事
·《反恐精英》录像：俄罗斯 vs 法国
·《反恐精英》1.6版AK练习法教学视频下载
·《魔法门外传5》黑暗魔君大反扑试玩
·《贝拉的魔法咒语》游戏试玩
·《法老王》硬盘版试玩
·《魔法门之英雄无敌1》中文版试玩经典怀旧

上一篇:.net中前台javascript与后台c#相互调用

下一篇:PHP5对Mysql5的任意数据库表的管理代码示例（一）

特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com

用CSS解决图片下面有空隙的方法

精品推荐

热点TOP10

特别推荐