我正在制作一个菜单,每个项目都有像item1、item2等文本。当鼠标悬停时,背景颜色会改变,文本变成透明的,并替换为背景图像。我使用了这段代码来缓慢地改变样式。但它只能用于背景颜色,而不能用于图像。
#nav li:hover {
color:transparent !important;
text-shadow: none;
background-color: rgba(255, 0, 0, .5);
-webkit-transition: all 1s ease-in;
-moz-transition: all 1s ease-in;
-o-transition: all 1s ease-in;
-ms-transition: all 1s ease-in;
transition: all 1s ease-in;
}
这是在线版本: http://jsfiddle.net/q4uHz/