2018-10-19 12:53:51 +00:00
|
|
|
|
---
|
|
|
|
|
|
title: Create a Gradual CSS Linear Gradient
|
|
|
|
|
|
localeTitle: 创建渐进的CSS线性渐变
|
2018-10-12 20:35:31 +00:00
|
|
|
|
---
|
|
|
|
|
|
##创建渐进式CSS线性渐变
|
|
|
|
|
|
|
|
|
|
|
|
要创建线性渐变，您必须至少定义两个色标。颜色停止是您想要渲染平滑过渡的颜色。您还可以设置起点和方向（或角度）以及渐变效果。
|
|
|
|
|
|
|
|
|
|
|
|
语法总是：
|
|
|
|
|
|
```
|
2018-10-19 12:53:51 +00:00
|
|
|
|
background-image: linear-gradient(angle, color-stop1, color-stop2);
|
2018-10-12 20:35:31 +00:00
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
颜色可以以hex（）和rgb（）格式使用。尝试一下，你会明白使用它是多么容易和美丽。
|
|
|
|
|
|
|
|
|
|
|
|
## 资源
|
|
|
|
|
|
|
|
|
|
|
|
[此链接提供有关此主题的广泛信息。](https://www.w3schools.com/css/css3_gradients.asp)
|
|
|
|
|
|
|
|
|
|
|
|
[此外，您可能想要查看The Net Ninja的Youtube视频。](https://www.youtube.com/watch?v=wTk4Wuckd0U)
|
