|
蓝森林 http://www.lslnet.com 2006年8月25日 8:28
 请问这种情况能否用CSS去掉LI之间的间距
[html]
<style>
ul{
line-height: 12px;
margin:0px;
padding:0px;
}
li {
list-style-type:none;
margin:0px;
padding:0px;
}</style
<UL>
<LI>
<UL>
<LI>111</LI>
<LI>222</LI>
</UL>
</LI>
<LI>
<UL>
<LI>111</LI>
<LI>222</LI>
</UL>
</LI>
</UL>[/html]
请看运行后的样子
111
222
111
222
两段之间有一行间隔
有没有办法通过样式使其变为
111
222
111
222
的样子呢? |
| 有没有高手指点一下啊? |
这样写不就好了。
[html]
<style>
menu{
line-height: 14px;
margin:0px;
padding:0px;
}
li {
list-style-type:none;
margin:0px;
padding:0px;
}</style>
<menu>
<LI>
<menu>
<LI>111</LI>
<LI>222</LI>
<LI>111</LI>
<LI>222</LI>
</menu>
</LI>
</menu>
[/html] |
汗,当然不行了
要的就是分两个LI显示啊 |
给你li定一个高度
[html]
<style>
ul{
line-height: 12px;
margin:0px;
padding:0px;
}
li {
list-style-type:none;
margin:0px;
padding:0px;
height: 15px;
}
</style>
<UL>
<LI>
<UL>
<LI>111</LI>
<LI>222</LI>
</UL>
</LI>
<LI>
<UL>
<LI>111</LI>
<LI>222</LI>
</UL>
</LI>
</UL>
[/html] |
添加浮动和clear
[html]
<!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">
<!--
li {
margin: 0px;
padding: 0px;
list-style-type: none;
}
ul {
margin: 0px;
padding: 0px;
display: inline;
}
ul ul{float:left;
clear:left;
}
-->
</style>
</head>
<body>
<ul>
<li>
<ul>
<li>111</li>
<li>222</li>
</ul>
</li>
<li>
<ul>
<li>111</li>
<li>222</li>
</ul>
</li>
</ul>
</body>
</html>[/html] |
阿能解释一下空隙的产生原因
以及设定高度后就消失的原因
感觉css还是不完善
不能达到完全随心所欲的定制
有时候表现确实让人难以捉摸 |
哈哈
谢谢5楼的anjo和6楼的mickeyboy
一直没想到给LI定HEIGHT
另外还有display: inline;
恩恩,这个真不错~ |
iampoper在上个帖子中说
空隙的原因我感觉是UL和它自己的LI不是在一行
就是说第一行是UL的行,下一行开始才是他的LI
不知道这么说合不合适~ |
<style>
ul{
line-height: 12px;
margin:0px;
padding:10px;
}
li {
list-style-type:none;
margin:0px;
padding:4px;
}</style
<UL>
<LI>
<UL>
<LI>111</LI>
<LI>222</LI>
</UL>
</LI>
<LI>
<UL>
<LI>111</LI>
<LI>222</LI>
</UL>
</LI>
</UL> |
iampoper在上个帖子中说
不能说是CSS不完善
其显示属性的初始值是block
(补充)
象刚才那种情况建议使用display: inline;
而不是去给li一个高度
因为你的内容是嵌套的
单给li高度的话在IE下正常但是FF下显示不正常
因为父级的li高度和子级高度都被定义成一样了
当然你可以用li li{}这样去定义
但是不如display来的方便 |
LZ的代码最好不要这样写。不要在<li></li>里面再嵌套<ul></ul>。
这是不符合语义的。 |
flashlizi在上个帖子中说
???
不懂
什么叫不符合语义??? |
语义？
ul是无序列表，li是无序列表的项，无序列表的项是另一个无序列表，为什么不符合语义呢？
帽子扣得太大了:D |
|
