css grandient,CSS linear-gradient() 函数

更多实例

实例

从左侧开始的线性渐变。它从红色开始，过渡到蓝色：

#grad {

background-image: linear-gradient(to right, red , blue);

}

实例

从左上角开始(到右下角)的线性渐变：

#grad {

background-image: linear-gradient(to bottom right, red , blue);

}

实例

有给定角度的线性渐变：

#grad {

background-image: linear-gradient(180deg, red, blue);

}

实例

拥有多个色标的线性渐变：

#grad {

background-image: linear-gradient(to right, red,orange,yellow,green,blue,indigo,violet);

}

实例

带透明度的线性渐变：

#grad {

background-image: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1));

}