论坛交流
首页办公自动化| 网页制作| 平面设计| 动画制作| 数据库开发| 程序设计| 全部视频教程
应用视频: Windows | Word2007 | Excel2007 | PowerPoint2007 | Dreamweaver 8 | Fireworks 8 | Flash 8 | Photoshop cs | CorelDraw 12
编程视频: C语言视频教程 | HTML | Div+Css布局 | Javascript | Access数据库 | Asp | Sql Server数据库Asp.net  | Flash AS
当前位置 > 文字教程 > div+css教程
Tag:css,入门,技巧,div,实例,示例,菜单,布局,web2.0,ul,li,经验,列表,web标准,xhtml,web标准,浏览器,兼容,css hack,表格,视频教程

li标记在IE下产生间距

文章类别:div+css | 发表日期:2009-12-5 11:28:31

当li元素设置了高度,且li内元素浮动时会触发该bug。
<style>
li{ background-color: green; height: 20px; }
li a { float: left; }
li span { float: right; }
</style>
<ul>
<li><a href="">aaa</a><span>bbb</span></li>
<li><a href="">aaa</a><span>bbb</span></li>
</ul>
解决方法:li设置css vertical-align: bottom;
<style>
li{ background-color: green; height: 20px; vertical-align: bottom; }
li a { float: left; }
li span { float: right; }
</style>
<ul>
<li><a href="">aaa</a><span>bbb</span></li>
<li><a href="">aaa</a><span>bbb</span></li>
</ul>
上边的方法一般都会解决问题,但是许多时候许多未知的原因,还会导致间距问题的出现。试试以下方法:
1.定义行高 line-height
2.设置隐藏 overflow:hidden
3.li增加浮动属性 float

上一篇:{教程}CSS sprite修改密码 人气:2826
下一篇:CSS制作虚线的方法 人气:10488
视频教程列表
文章教程搜索
 
div+css推荐教程
div+css热门教程
看全部视频教程
购买方式/价格
购买视频教程: 咨询客服
tel:15972130058