/* 鼠标悬停效果 */ a:hover { color: red; text-decoration: underline; }
上述代码中,大家选择所有的标签,并使用:hover伪类来定义鼠标悬停效果。当用户将鼠标悬停在标签上时,文字颜色变为红色,下划线出现。
除了标签,大家还可以对其他HTML元素应用鼠标悬停效果。比如,下面的代码演示了如何为图片添加鼠标悬停效果:
/* 图片鼠标悬停效果 */ img:hover { opacity: 0.8; filter: alpha(opacity=80); }
在上述代码中,大家使用CSS3属性opacity来控制图片的透明度,并使用filter属性为IE浏览器提供降低透明度的兼容性。
总之,使用CSS实现鼠标悬停效果是网页设计中常见的需求,掌握相关的CSS属性和选择器,将有助于提升网页的交互性和用户体验。