css漸變背景

Question

請問有什麼辦法可以用CSS製作漸變背景嗎？

http://postimg.org/image/4ob4wpdej/？

Answer 1

，你可以使用這個鏈接 http://www.colorzilla.com/gradient-editor/

background: #1e5799; /* Old browsers */ 
background: -moz-radial-gradient(center, ellipse cover, #1e5799 0%, #2989d8 96%,  #207cca 100%, #7db9e8 100%); /* FF3.6+ */ 
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-  stop(0%,#1e5799), color-stop(96%,#2989d8), color-stop(100%,#207cca), color- stop(100%,#7db9e8)); /* Chrome,Safari4+ */ 
background: -webkit-radial-gradient(center, ellipse cover, #1e5799 0%,#2989d8 96%,#207cca 100%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */ 
background: -o-radial-gradient(center, ellipse cover, #1e5799 0%,#2989d8 96%,#207cca 100%,#7db9e8 100%); /* Opera 12+ */ 
background: -ms-radial-gradient(center, ellipse cover, #1e5799 0%,#2989d8 96%,#207cca 100%,#7db9e8 100%); /* IE10+ */ 
background: radial-gradient(ellipse at center, #1e5799 0%,#2989d8 96%,#207cca 100%,#7db9e8 100%); /* W3C */ 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=1); /* IE6-9 fallback on horizontal gradient */ 

Answer 2

這在我看來是一個徑向漸變試試這個代碼 。 看看這個更新小提琴：http://jsfiddle.net/dimboiu/8ptr2/2/（latest source/source）

#radial-center { 
    width:500px; 
    height:500px; 
    display:block; 
    /* fallback */ 
    background-color: #2F2727; 
    background-image: url(''); 
    background-position: center top; 
    background-repeat: no-repeat; 

    background-image: radial-gradient(center top, ellipse cover, #ffeda3, #ffc800); 
    background-image: -o-radial-gradient(center top, ellipse cover, #ffeda3, #ffc800); 
    background-image: -ms-radial-gradient(center top, ellipse cover, #ffeda3, #ffc800); 
    background-image: -moz-radial-gradient(center top, ellipse cover, #ffeda3, #ffc800); 
    background-image: -webkit-radial-gradient(center top, ellipse cover, #ffeda3, #ffc800); 
}