3将title修改为htmlcss，实现横向导航4创建一个新的divid“A”并添加ulli标签5在li中添加所需的文本，并调整文本间距按F12预览，如下图所示6首先去掉字体前面的小黑点代码如下7预览，如图所示8接下。

一，这要用到float浮动属性二，floatleft代表想做浮动，也就是横向排列是向左边排列四，代码如下 dw如何制作横向导航条设置css，浮动，定位，或者设置display为行内元素，当然，宽度一定要够用。

所有代码 ！DOCTYPE html html head meta charset=#34UTF8#34 title横向导航菜单title style type=#34textcss#34 nav li backgroundcolor red padding 8px 15px float left liststyle。

用表格布局很简单，1行多列就好了，控制好高度用css的话我一般会使用ulli 首页 资料下载 给li添加“floatleft displayinline”属性，至于表现形式怎么样就是你设计的问题了。

第一步编写横向菜单的HTML代码架构请将以下代码添加到HTML文档的导航栏区域中标签范围中#menufont12pxverdana，arial，sansserif*设置文字大小和字体样式*#menu，#menulilist。

如图，制作导航条菜单一般是用一个div嵌套ul和li标签，然后li里面有a标签布局做好之后，开始写导航条的样式，如图，先清除导航条的margin和padding然后定位导航条的div，这里我就用绝对定位来居中，如果你有其他导航条居中。

html 横向导航栏一般用两种方法来制作第一种，我们使用块状结构结合行内结构来制作第二种，我们使用#8203float#8203属性来制作由于第一种比较常用，一下就以第一种方式来介绍首先大家要明确一下块状元素与行内。