CSS+js网页导航二级目录想把横排变竖排应该怎样改

html-css024

CSS+js网页导航二级目录想把横排变竖排应该怎样改,第1张

一看你的menu是table布局就不可能改成竖排了,如果是现在流行的dv布局只需要修改css就好,但是table布局就改不了了。

这是多少年前的menu了,太古老了,目前比较流行的格式是

<div id="menu">

<ul>

<li>

<a href="#">第1层</a>

<ul>

<li><a href="#">第2层</a></li>

<li><a href="#">第2层</a></li>

</ul>

</li>

<li><a href="#">第1层</a></li>

</ul>

</div>

还是用这个吧,seo更为友好,更容易理解, 数据(html)与表现(css)分离。

如何控制css让三个标签横排显示或者三个以上的标签横排,其实都是一样的,下面演示一下,通过控制li标签实现横排显示;

1、打开所需测试的软件,创建一个新的html

2、写入要实现效果的代码:

3、利用css来控制横排展示;

4、展示的效果为:

详解css:主要是控制li标签的靠左浮动:float:left;当然,展示在一排,靠右浮动也是可以的,list-style-type:none意思是:去除图2展示的前面的点;至于margi-right:20px;让li标签与右侧外边距离为20px