使背景淡出/进入

Question

有什么方法可以使用CSS3淡出和淡出<div>的纯白色背景？ 内容应保持可见，因此背景应该消失。

使用css3转换/转换的任何想法？

谢谢你的帮助。

Answer 1

当然，您可以直接在background-color上使用transition property：

div {
   background-color: white;    

   /* transition the background-color over 1s with a linear animation */
   transition: background-color 1s linear;
}

/* the :hover that causes the background-color to change */
div:hover {
   background-color: transparent;      
}

此处:hover的红色背景的an example渐渐消失。

Answer 2

您可能会发现这对图像和背景颜色淡化的示例非常有用： - http://nettuts.s3.amazonaws.com/581_cssTransitions/demos.html

但是，使用CSS 3进行转换会限制对不支持它的浏览器的影响。

Answer 3

你可以在一个容器div中有两个divs。第一个div包含白色背景，第二个div包含内容。

然后，使用CSS3变换将第一个div的不透明度设置为零。