如何使HTML列表水平显示，而不是垂直使用CSS？ [英] How to make a HTML list appear horizontally instead of vertically using CSS only?

问题描述

我希望不要使用绝对定位，因为它可能当我开始改变页面的布局时，会变得凌乱。

我也想删除子列表的缩进。

解决方案

您必须使用下面的内容

  #menu ul {list-style：none;}＃menu li {display：inline;}  / pre> 
 < div id =menu> < ul> < li>第一个菜单项< / li> < li>第二个菜单项< / li> < li>第三个菜单项< / li> < / ul>< / div>  
 

I need this because I want to make a menu (which is made from a HTML list) appear horizontally.

I prefer not to use absolute positioning since it might become messy when I start changing the layout of the page.

I would like also to remove the indenting of the sub-lists. Is it possible?

解决方案

You will have to use something like below

#menu ul{
  list-style: none;
}
#menu li{
  display: inline;
}
	

<div id="menu">
  <ul>
    <li>First menu item</li>
    <li>Second menu item</li>
    <li>Third menu item</li>
  </ul>
</div>

这篇关于如何使HTML列表水平显示，而不是垂直使用CSS？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！