改变背景颜色CSS3

我有以下几点：改变背景颜色CSS3

#box1 { 
    position: absolute; 
    width: 400px; 
    border: 1px solid black; 
    box-shadow: -3px 8px 34px #808080; 
    border-radius: 20px; 
    box-shadow: -8px 5px 5px #888888; 
    right: 100px; top: 50px; 
    height: 300px; 
    background: -webkit-gradient(linear, left top, left bottom, from(#E0FFFF), to(#ADD8E6)); 
    -webkit-animation-name:myfirst; 
    -webkit-animation-duration:5s; 
    -webkit-animation-timing-function:linear; 
    -webkit-animation-iteration-count:infinite; 
    -webkit-animation-direction:alternate; 
    -webkit-animation-play-state:running; 
} 

@-webkit-keyframes myfirst /* Safari and Chrome */ 
{ 
from {background:red;} 
to {background:yellow;} 
}

我的问题是：在这些线路

from {background:red;} 
    to {background:yellow;}

我怎样才能更改起始颜色（红色）这个（在下一行）将在后台像这样的颜色：

-webkit-gradient(linear, left top, left bottom, from(#E0FFFF), to(#ADD8E6));

来源

2012-11-30 tsnave

可能重复：http://stackoverflow.com/questions/5654510/css3-animation-with-gradients –

一个梯度背景图像，而不是背景颜色。你想如何在两种不同的属性之间进行转换？ –

我的意思是说，这个“从（＃E0FFFF）到（＃ADD8E6）”将是开始颜色，黄色将在最后。我可以做吗？ – tsnave

试试看看这个代码。

注意：当您使用子格有可能...

<!DOCTYPE HTML> 
<html> 
<head> 
<title>What</title> 
<style type="text/css"> 
#box1 { 
    position: absolute; 
    width: 400px; 
    border: 1px solid black; 
    box-shadow: -3px 8px 34px #808080; 
    border-radius: 20px; 
    box-shadow: -8px 5px 5px #888888; 
    right: 100px; top: 50px; 
    height: 300px; 
    background: -webkit-gradient(linear, left top, left bottom, from(#E0FFFF), to(#ADD8E6)); 
} 

#box1 > div 
{ 
    width: 100%; 
    height: 100%; 
    border-radius: 20px; 
    background-color: yellow; 
    opacity: 0; 
    -webkit-animation:myfirst 5s; 
} 

@-webkit-keyframes myfirst /* Safari and Chrome */ 
{ 
    from { opacity: 0; } 
    to { opacity: 1;} 
} 
</style> 
</head> 
<body> 

<div id="box1"><div></div></div> 

</body> 
</html>

来源

2012-11-30 16:11:30

谢谢，我不明白你在这里做了什么（你能解释请求吗？），并且这段代码不适合我... – tsnave

什么是您的浏览器？ – 2012-11-30 16:36:47

谷歌Chrom只有 – tsnave

改变背景颜色CSS3

回答

相关问题