渐变基础
如果不依赖图像就不可能使用渐变，但是CSS的发展意味着现在在样式表中创建渐变现在变得简单可靠。
在最简单的形式中，我们将渐变定义为背景图像。我们将背景图像（只是简写background为绝对精细）设置为“a” linear-gradient或“a” radial-gradient，然后我们传入开始和结束颜色：
.box {
background: linear-gradient(#000046, #1cb5e0);
}
body {
background: #f2f2f2;
text-align: center;
}
.box {
background: linear-gradient(#000046, #1cb5e0);
color: white;
padding: 6rem 1rem;
margin: 4rem;
font-size: 100px;
}
默认情况下，线性渐变从上到下运行，给我们这样的东西：
网站建设
同样，改变这个参数来读取to top right会创建一个对角线渐变。通过指定类似的东西45deg（或者你选择的任何角度），你也可以使对角线变得精确。
更进一步，你不需要停在两种颜色。你也可以使用颜色名称，像这样：
.box {
background: linear-gradient(to right, orange, #ec38bc, #7303c0, cyan);
}
原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/261010.html