<html>
<body>
<details>
<summary>Copyright 2011.</summary>
<p>All pages and graphics on this web site are the property of W3School.</p>
</details>
</body>
</html>
1．创建一个新的HTML文件百，该文件被称为测试。标题是“CSS实现的鼠标在导航栏上显示的超链接的下划线效果”。
2．在页面上写nav标签，放入三个超链接（首页，第一栏，第二栏），代码如下。
3．运行代码，效果如下。
4．使用backCSS来美化字体大小、颜色和导航字体的排列。守则如下。
5．运行代码，效果如下：可见，经过CSS样式美化，当鼠标经过时，显示蓝色。
6．使用CSS代码，实现鼠标在上面显示下划线效果，代码如下。
7．在浏览器中运行代码以达到预期的效果。
为简化用户操作，希望鼠标悬停在下拉列表框上时，能自动展开。查了一下select的属性，没有相关的操作。最后找了一个变通的办法，代码如下：<select onmouseover="size=10" onmouseout="size=1" onchange="size=1">
<option value="126.htm">126</option>
<option value="163.htm">163</option>
<option value="16.NET.htm">163net</option>
<option value="163vip.htm">163vip</option>
就是让鼠标悬停后，显示的数目就自动改成10或其它数目。鼠标移开后，还原成只显示一个。用户点击了某一项也让它恢复成正常状态。
