降低内联li的高度吗？

我正在使用内联无序列表菜单选项卡。我可以看到李的高度大于ul。我想将li的高度设置为ul。我该怎么做，任何人都可以帮忙。降低内联li的高度吗？

2011-08-07 satheesh.droid

发布您的代码请 – fatnjazzy

你尝试给'li'元素的顶部和底部零填充，并在顶部和底部零边距？你有什么尝试？ –

@Ray Toal Tes，但它不起作用 –

如果你想设定一个li父ul的高度的高度，你可以使用inherit功能：

li { 
    height: inherit; 
}

或者，也可以两者都设置为同一个号码：

ul, li { 
    height: /*insert height*/; 
}

来源

2011-08-07 04:10:55

ul, li { 
    height:50px; 
}

........

来源

2011-08-07 04:11:04 AlienWebguy

ul { position: relative; } 

li { height: 100%; }

来源

2011-08-07 07:04:17 Joey

您可以通过提供一些详细信息以及它在哪些浏览器中的作用来改进此答案吗？ – Pindatjuh

为什么使用内联<li>？您可以随时使用它像这样：

<ul> 
    <li>First</li> 
    <li>Second</li> 
    <li>Third</li> 
</ul>

CSS代码：

ul li { 
    display: block; 
    width: 100px; 
    float: left; 
    height: xxxx; //anythin you want here 
}

与解决方案的唯一问题是菜单项的宽度不变。如果你真的需要这个，你的解决方案将是内嵌块CSS属性。

<html> 
<head> 
<style> 
ul li { 
    background: red; 
    display: inline-block; 
    line-height: 90px; 
} 
ul { 
    background: green; 
} 
</style> 
</head> 
<body> 
<ul> 
    <li><a href="">One</a></li> 
    <li><a href="">Two</a></li> 
    <li><a href="">Three</a></li> 
</ul> 
</body> 
</html>

您可以设置宽度，高度，背景和其他许多元素，但元素仍然在文本流内。

预览代码：http://albitos.eu/~albi/stackoverflow/inline-li-height.html

来源

2011-08-07 08:15:03

降低内联li的高度吗？

回答

相关问题