我有一个网站 here ...
当您查看此页面时,您会看到一个评论气泡的图像...
这是附加到该评论气泡的 CSS...
#content .postmetadata .comments {
background-image:url(images/comment.png);
background-repeat:no-repeat;
position:absolute;
bottom:8px;
height:25px;
*bottom:18px;
margin-left:8px;
}
我想做的是,默认情况下,您会看到那里的图像...(它是黑色的,不透明度约为 50%)。
当您将鼠标悬停在它上面时,图像会变成红色,但背景会保持透明,因此只有气泡会改变颜色。
我已经准备好红色图像,或者我可以用 CSS 做些什么?
这有意义吗?
最佳答案
我认为您正在尝试对我的社交媒体链接执行我网站上的操作。
我将它设置为 Sprite : http://michelenarup.com/wp-content/themes/Portfolio/images/social.png
并且代码将更改悬停状态的背景位置:
#facebook{background-position: -100px 0px; float:left; height:50px; width:50px; padding:0; background-image: url('../images/social.png'); margin-bottom: 10px;}
a#facebook:hover{background-position: -100px -50px; outline:none;}
---编辑---
a.comments {
background-image:url(images/comment.png);
background-repeat:no-repeat;
position:absolute;
bottom:8px;
height:25px;
*bottom:18px;
margin-left:8px;
}
a.comments:hover {
background-image:url(images/comment-hover.png);
background-repeat:no-repeat;
position:absolute;
bottom:8px;
height:25px;
*bottom:18px;
margin-left:8px;
}
关于css - 在 Wordpress 中创建 CSS 悬停图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18704365/