css3鼠标悬停hover

CSS3中的鼠标悬停效果是网页设计中很常用的一种技术，也就是所谓的“hover”。当用户将鼠标移动到一个元素上时，元素的外观会出现变化。实现这种效果需要使用CSS的:hover伪类。

/* 鼠标悬停效果 */
.element:hover {
  background-color: #ccc;
  color: #fff;
} 

在上面的代码中，我们将元素的背景颜色设置为#ccc，并将文字颜色设置为白色。当鼠标移动到元素上时，它们的颜色就会发生改变。

除了更改背景颜色和文字颜色之外，我们还可以在:hover伪类中添加其他属性，例如边框、阴影、透明度等。

/* 鼠标悬停效果 */
.element:hover {
  border: 1px solid #000;
  box-shadow: 2px 2px 2px #888888;
  opacity: 0.8;
} 

在上面的代码中，我们添加了边框、阴影和透明度，当鼠标移动到元素上时，它们的边框将会被设置为1像素的实线黑色，阴影效果将被添加到包围元素的任何地方，透明度将被设置为0.8，使元素看起来更加半透明。

总之，使用CSS3中的:hover伪类可以为网页设计和用户体验增添更多的乐趣和互动性。只需要在样式表中添加对应的代码即可。