用DW写，下拉立菜单，当鼠标经过菜单时，显示其 下拉框中的内客 鼠标离开时，下拉菜单隐藏

在Dreamweaver (DW) 中创建下拉菜单并实现鼠标悬停显示内容和离开隐藏的效果，通常涉及到HTML、CSS和JavaScript的结合。以下是基本步骤：

1. **HTML结构**:
使用`<select>`标签创建一个下拉菜单，包含若干`<option>`元素，这些选项代表了下拉框中的内容。

   <div id="dropdown">
     <select id="myDropdown">
       <option value="option1">选项1</option>
       <option value="option2">选项2</option>
       <!-- 添加更多选项 -->
     </select>
   </div>

2. **CSS样式**:
- 设定默认样式，如颜色、位置等。
- 当鼠标悬停在`select`元素上时，更改下拉列表的可见性。

   #myDropdown {
     display: none; /* 默认隐藏 */
   }
   
   #dropdown:hover > select {
     display: block; /* 鼠标悬停时显示 */
   }

3. **JavaScript (仅用于老版本浏览器)**:
对于一些不支持CSS伪类`:hover`的老版浏览器，可以添加JavaScript事件处理程序来实现同样效果。

   var dropdown = document.getElementById("myDropdown");
   dropdown.onmouseover = function() { this.style.display = "block"; };
   dropdown.onmouseout = function() { this.style.display = "none"; };

4. **现代做法** (推荐):
使用CSS `:hover` 或 `:focus-within` 和纯CSS选择器可以避免兼容性问题，同时让代码更简洁。

   #dropdown {
     position: relative;
   }

   #myDropdown {
     display: none;
     position: absolute;
   }

   #dropdown:hover > #myDropdown,
   #myDropdown:focus-within {
     display: block;
   }

完成上述设置后，当你将鼠标悬停在Dreamweaver设计视图中的下拉菜单上时，它会显示其内容；鼠标移开时，下拉菜单会自动隐藏。