FCC---Create a Gradual CSS Linear Gradient

2023-04-20,,

Applied Visual Design: Create a Gradual CSS Linear Gradient

background: linear-gradient(gradient_direction, color 1, color 2, color 3, ...)
 
The first argument specifies the direction from which color transition starts - it can be stated as a degree, where 90deg makes a vertical gradient and 45deg is angled like a backslash.
The following arguments specify the order of colors used in the gradient.
 
Example:
background: linear-gradient(90deg, red, yellow, rgb(204, 204, 255));

练习代码如下:

<style>
div {
border-radius: 20px;
width: %;
height: 400px;
margin: 50px auto;
background: linear-gradient(35deg, #ccffff, #ffcccc);
}
</style>
<div></div>

效果如下:
 
 

FCC---Create a Gradual CSS Linear Gradient的相关教程结束。

《FCC---Create a Gradual CSS Linear Gradient.doc》

下载本文的Word格式文档,以方便收藏与打印。