<分区>
<分区>
大家好，我用 css 运行淡入淡出效果，效果很好，我想在获得淡入淡出时更改颜色，但我没有成功。
如果我在没有图像的情况下使用，淡入淡出会改变颜色，但如果我使用我的图像则不起作用。
例子: 我试过了:
background-color: red;
但我没有成功，无论如何有人知道如何让淡入淡出的背景成为不同的颜色？现在只想换成白色，是否可以换成其他颜色？
现在我有一张图片，当我将鼠标悬停时出现淡白色效果，我只想将白色更改为红色。
PHP:
<img id="slide-img-1" src="<?php echo get_bloginfo('template_directory');?>/public/images/get_.jpg" class="slide fade " alt="" />
CSS:
.fade {
opacity: 1;
transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
}
.fade:hover {
opacity: 0.5;
}
最佳答案
Here's a Fiddle覆盖背景:红色；在包含您选择的图像的 div 上。
HTML
<div class="box fade"><img src="http://placehold.it/350x150"></div>
CSS
.box {
width:350px;
height:150px;
}
.fade {
position: relative;
}
.fade:after {
background-color: red;
position: absolute;
top:0;
left:0;
width:100%;
height:100%;
opacity:0;
transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
}
.fade:hover:after {
opacity: .5;
}
关于html - CSS淡入淡出效果背景色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31621767/