css中<ul><li>的line-height设置百分比时,火狐怎么不能解析
css中<ul><li>的line-height设置百分比时,在ie6中没问题在火狐中怎么不能解析它们的行高?怎么能做到在火狐中<li>的宽度固定,高度能随着<li>内容...
css中<ul><li>的line-height设置百分比时,在ie6中没问题 在火狐中怎么不能解析它们的行高?怎么能做到在火狐中 <li>的宽度固定,高度能随着<li>内容的填充自适应。并且父容器<ul>的高度也能随之自适应。
感谢各位前辈赐教。 展开
感谢各位前辈赐教。 展开
5个回答
展开全部
不要给<li>设高度,如:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
body{ background:url(body_bg.gif) #fff repeat-x left top;font-size:12px; height:30px;line-height:30px; color:#666; font-family:12px/1.2 SimSun, Arial, Helvetica, sans-serif; }
*{margin:0;padding:0;}
ul.incenlb{ width:300px;border:1px solid #cc0000;padding:10px;}
ul.incenlb li{margin-bottom:0px; padding:8px 0px;vertical-align:top;}
</style>
</head>
<body>
<ul class="incenlb">
<li><a href="http://hi.baidu.com/鱼儿满天飞zyq/blog">鱼儿满天飞zyq《孝庄秘史》《激情燃烧的岁月</a></li>
<li><a href="#">《康熙王朝》《孝庄秘史》《激情燃烧的岁月</a></li>
<li><a href="#">《康熙王朝》《孝庄秘史》《激情燃烧的岁月</a></li>
<li><a href="#">《康熙王朝》《孝庄秘史》《激情燃烧的岁月</a></li>
<li><a href="#">《康熙王朝》《孝庄秘史》《激情燃烧的岁月</a></li>
</ul>
</body>
</html>
可以设置<li>的内边框!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
body{ background:url(body_bg.gif) #fff repeat-x left top;font-size:12px; height:30px;line-height:30px; color:#666; font-family:12px/1.2 SimSun, Arial, Helvetica, sans-serif; }
*{margin:0;padding:0;}
ul.incenlb{ width:300px;border:1px solid #cc0000;padding:10px;}
ul.incenlb li{margin-bottom:0px; padding:8px 0px;vertical-align:top;}
</style>
</head>
<body>
<ul class="incenlb">
<li><a href="http://hi.baidu.com/鱼儿满天飞zyq/blog">鱼儿满天飞zyq《孝庄秘史》《激情燃烧的岁月</a></li>
<li><a href="#">《康熙王朝》《孝庄秘史》《激情燃烧的岁月</a></li>
<li><a href="#">《康熙王朝》《孝庄秘史》《激情燃烧的岁月</a></li>
<li><a href="#">《康熙王朝》《孝庄秘史》《激情燃烧的岁月</a></li>
<li><a href="#">《康熙王朝》《孝庄秘史》《激情燃烧的岁月</a></li>
</ul>
</body>
</html>
可以设置<li>的内边框!
展开全部
尊敬的用户,您好!很高兴为您答疑
如果您希望实现的是边框对文字的自动包裹的效果,建议使用padding属性。
参考代码:
<div>
<ul>
<li style="padding:8px;border:1px solid #000">XXXXXXXXX</li>
</ul>
</div>
在此情况下,li会根据里面的内容自动调节大小。
希望我的回答对您有所帮助,如有疑问,欢迎继续咨询我们。
如果您希望实现的是边框对文字的自动包裹的效果,建议使用padding属性。
参考代码:
<div>
<ul>
<li style="padding:8px;border:1px solid #000">XXXXXXXXX</li>
</ul>
</div>
在此情况下,li会根据里面的内容自动调节大小。
希望我的回答对您有所帮助,如有疑问,欢迎继续咨询我们。
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
给li里面的a设置:display:block;
然后给a宽度和高度就行了,a有了宽高会撑开li,li自然撑开ul
然后给a宽度和高度就行了,a有了宽高会撑开li,li自然撑开ul
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0; padding:0;}
ul{ width:300px; border:1px solid red; margin:10px auto 0 auto; line-height:22px; padding:5px 0 5px 5px;}
ul li{ list-style:none; width:280px; border:1px solid 09F;margin-top:5px;}
</style>
</head>
<body>
<ul>
<li>信息内容信息内容信息内容信息内容信息内容信息内容信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
</ul>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0; padding:0;}
ul{ width:300px; border:1px solid red; margin:10px auto 0 auto; line-height:22px; padding:5px 0 5px 5px;}
ul li{ list-style:none; width:280px; border:1px solid 09F;margin-top:5px;}
</style>
</head>
<body>
<ul>
<li>信息内容信息内容信息内容信息内容信息内容信息内容信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
<li>信息内容信息内容信息内容</li>
</ul>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
CSS可以参考W3C标准 http://www.w3school.com.cn/css/
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询