程序输入如下:
<div id="menu">
<br/>
<ul>
<li>..</li>
<li>..</li>
<li>..</li>
</ul>
</div>
#menu{
overflow:hidden
height:20px}
#menu:hover {
height:100px}
选择鼠标指针浮动在其上的元素,并设置其样式:
a:hover{
background-color:yellow}
对于HTML 部分:
可以使用任何的 HTML 元素来打开下拉菜单,如:<span>, 或 a <button>元素。使用容器元素 (如: <div>) 来创建下拉菜单的内容,并放在任何你想放的位置上。使用 <div>元素来包裹这些元素,并使用 CSS 来设置下拉内容的样式。
对于CSS 部分:
.dropdown 类使用 position:relative, 这将设置下拉菜单的内容放置在下拉按钮 (使用 position:absolute) 的右下角位置。
网站上一般都是利用css来做的。具体的做法:1、将导航栏里面的几个条目都做成无序列表里面的项
2、利用css将列表项的list-style,float等等属性设置,使列表项横排排列。
3、设置链接的属性就可以了。
一般都是这样做的,利用图片或者flash的话,网页会变大一点,对于网速慢的人来说,不方便访问。所以在能利用css的地方就尽量避免用图片或者falsh
css定义一条导航栏首先建立一个DIV,为其命名为“nav”,在DIV中建立一个<ul>无序列表,导航共有几个栏目,就为列表添加几个<li>的列表项,为每个列表项中的内容加上超链接,链接到所需的项目页面。
然后设置CSS样式,为列表规定宽度和高度,去掉列表前面的符号,代码为:
ul {width:宽度值;height:高度值; list-style:none;}
如果是横向导航,还需为里面的列表项<li>标签设置左浮动的样式,代码为:li {float:left}
每个栏目之间分隔的距离可通过margin(外边距)属性来设置。
导航条的更多样式及详细步骤可去这里参考http://jingyan.baidu.com/article/da1091fb05fe93027849d600.html