程序输入如下：
<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超链接的伪类中表示鼠标悬浮上的是hover。要定义链接样式，其中必不可少的就是超级链接中的锚标签，锚标签和伪类链接起来书写的方法就是定义链接样式的基础方法，写法如下：link，定义正常链接的样式。visited，定义已访问过链接的样式。hover，定义鼠标悬浮在链接上时的样式。active，定义鼠标点击链接时的样式。其中：：link和：visited只能用于设置超链接a，：hover和：active则可适用所有元素，hover用来表示鼠标移入的状态，active用来表示鼠标点击。划水摸鱼的时候研究了下CSS实现悬浮式菜单，在此分享一下！
transition是一个复合属性，有四个属性transition: <transition-property>|| <transition-duration>|| <transition-timing-function>|| <transition-delay>
另外，transition与display的冲突此处暂不做讨论！
