如何在CSS中制作渐变背景?

问题描述:

除了CSS之外,有什么方法可以创建渐变背景吗?

Is there any way to create a gradient background using nothing but CSS?

您可以在此网站上看到我想要实现的示例 .

You can see an example of what I want to achieve on this website.

在CSS中使用它:

background-image: -o-linear-gradient(bottom, rgb(254,133,107) 24%, rgb(35,171,17) 62%);
background-image: -moz-linear-gradient(bottom, rgb(254,133,107) 24%, rgb(35,171,17) 62%);
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.24, rgb(254,133,107)), color-stop(0.62, rgb(35,171,17)));
background-image: -webkit-linear-gradient(bottom, rgb(254,133,107) 24%, rgb(35,171,17) 62%);
background-image: -ms-linear-gradient(bottom, rgb(254,133,107) 24%, rgb(35,171,17) 62%);
/* This last line is all you need for modern browsers */
background-image: linear-gradient(bottom, rgb(254,133,107) 24%, rgb(35,171,17) 62%);

另请参阅:

  • The specification
  • The MDN documentation