style type=#34textcss#34 * margin0 padding0 jiao ul li ahover color#red ul， li liststyle a textdecoration jiao border5px solid #pink bor。

3个容器如果要在一条直线上排列，那么容器宽度的综合一定要小于外围容器的宽度，在图片中看不出来你外围容器宽度是多少，你可以先设定死3个容器的宽度再测试一下估计主要是因为你的容器没有宽度，大小都是另360本身是没。

很多小伙伴学习了一段时间的HTML和css，就想自己动手试试制作导航条菜单，不过却没有思路，今天小编我就来分享一下HTML和css制作导航条的实例，大家可以参考参考如图，制作导航条菜单一般是用一个div嵌套ul和li标签，然后li。

body margin0px padding0px h1，h2，h3，h4，h5，h6，p，form，div，ul，li，img margin0px padding0px inimgtextaligncenter fontfamilyArial， Helvetica， sansserif fontsize12px in。

要用table的话就这样写 图片1图片2图片3 用div写的话就简单点写得去考虑总宽度，麻烦点的就跟table差不多 Divwidth1001pxmargin0px autooverflowHidden Div imgwidth300pxmarginleft30px。

你给div设置一个宽度不就行了块级元素默认情况是横着都占满浏览器的，你设置个宽度就行啦。

因为我们要做的是横向的导航栏，所以现在我们要把它变成横向排列我们在样式中加入以下代码nav ul li floatleft*让li元素左浮动* 我们看到测试结果如图4边框之所以挤到一起了是因为浮动以后 li就变成了联。

放上全部的代码吧，可以参考一下啊， lt！DOCTYPE html 允许你通过一个网址来识别你的标记 css实现下拉导航栏菜单。

css制作横排二级下拉菜单，代码如下 一级栏目 二级菜单 二级菜单 二级菜单 一级栏目 二级菜单 二级菜单 二级菜单。