繁体中文
设为首页
加入收藏
当前位置:在线教程首页 >> 网页设计 >> CSS与特效 >> CSS实战:解决图片下面有空隙的简单的方法

CSS实战:解决图片下面有空隙的简单的方法

2007-10-25 03:38:34  作者:佚名  来源:豆豆技术应用频道  浏览次数:0  文字大小:【】【】【
简介:解决方法:在图片的css中加 vertical-align:bottom; 效果      演示代码:  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><ht ...
关键字:实战 图片 空隙
解决方法:在图片的css中加 vertical-align:bottom; 效果

  CSS实战:解决图片下面有空隙的简单的方法

  演示代码: 

<!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>

此文章不能满足您的需求?那就就Google一下吧:)
Google
 

责任编辑:fuyang


相关文章
 

最新文章

更多

· 关于CSS你只需知道的十件事
· CSS网站实用技巧:word-...
· CSS实战:解决图片下面有...
· 中文网页制作中段落缩进...
· 巧用CSS制作树状目录
· CSS重新定义项目符号和编号
· 网页特效大公开
· css新手上路<七>
· css新手上路<六>
· css新手上路<五>

推荐文章

更多

· 关于CSS你只需知道的十件事
· CSS网站实用技巧:word-...
· CSS实战:解决图片下面有...
· 中文网页制作中段落缩进...
· 巧用CSS制作树状目录
· CSS重新定义项目符号和编号
· 网页特效大公开
· css新手上路<七>
· css新手上路<六>
· css新手上路<五>

热点文章

更多

· CSS实战:解决图片下面有...
· CSS网站实用技巧:word-...
· 关于CSS你只需知道的十件事