简介
div:hover{
background:red;}
当鼠标浮动到div标签上的时候，div标签才会显示出background:red的样式。为了确保生效，:hover规则需要放在:link和:visited规则之后，但是在:active规则之前。
注意: 在触摸屏上
:hover有问题，基本不可用。不同的浏览器上:hover伪类表现不同。
下拉按钮
使用:hover 伪类可以创建复杂的层叠机制。一个常见用途，比如，创建一个纯CSS的下拉按钮（不使用JavaScript）。 本质是创建如下的CSS：
<style>
div.menu-bar ul ul{
display:none;
}
div.menu-bar li:hover>ul{
display:block;
}
</style>
<div class="menu-bar">
<ul>
<li>
<a href="example.html">Menu</a>
<ul>
<li>
<a href="example.html">Link</a>
</li>
<li>
<a class="menu-nav" href="example.html">Submenu</a>
<ul>
<li>
<a class="menu-nav" href="example.html">Submenu</a>
<ul>
<li><a href="example.html">Link</a></li>
<li><a href="example.html">Link</a></li>
<li><a href="example.html">Link</a></li>
<li><a href="example.html">Link</a></li>
</ul>
</li>
<li><a href="example.html">Link</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
