css线性渐变的关键字是甚么
CSS线性渐变的关键字是`linear-gradient`。它是CSS3中的一个属性,用于创建线性渐变效果。通过指定渐变的起始点、终止点和中间色彩的位置,可以创建从一种色彩过渡到另外一种色彩的平滑过渡效果。`linear-gradient`属性可以用于文本、边框和背景等效果。在使用时需要指定渐变的方向、渐变的起始色彩和终止色彩和中间色彩的位置和色彩值等参数。
CSS线性渐变语法以下:
```css
background:linear-gradient(direction,color-stop1,color-stop2,...);
```
其中,`direction`表示渐变方向,可以是水平方向(`toright`)、垂直方向(`tobottom`)还是对角线方向(`tobottomright`)。`color-stop`表示色彩的变化点,可以是固定的色彩值还是百分比值。
例如,以下代码实现了从上到下的渐变背风景:
```css
background:linear-gradient(tobottom,#ffffff,#000000);
```
其中,`tobottom`表示从上往下的渐变方向,`#ffffff`表示起始色彩(白色),`#000000`表示结束色彩(黑色)。
以下是一些常见的渐变效果示例:
1.从左到右的渐变背风景:
```css
background:linear-gradient(toright,#ff0000,#00ff00,#0000ff);
```
2.对角线渐变背风景:
```css
background:linear-gradient(tobottomright,#ff0000,#00ff00);
```
3.多个色彩之间的渐变:
```css
background:linear-gradient(toright,#ff0000,#ffff0050%,#00ff00);
```
其中,`#ffff0050%`表示在渐变进程中,从第二个色彩(黄色)开始,到达第三个色彩(绿色)时,变化点的位置为50%。
需要注意的是,CSS线性渐变在各种浏览器中的兼容性有所区分,需要根据实际情况进行兼容性处理。