CSS 渐变
-
CSS渐变
CSS渐变可让您在两种或多种指定颜色之间显示平滑过渡。CSS定义了两种类型的渐变:- 线性渐变(向下/向上/向左/向右/对角线)
- 径向梯度(由其中心定义)
-
-
使用角度
如果您想要更多地控制渐变的方向,您可以定义一个角度,而不是预定义的方向(从底部,顶部,右侧,左侧,右下角等)。语法
-
-
使用透明度
CSS渐变还支持透明度,可用于创建淡入淡出效果。为了增加透明度,我们使用rgba()函数来定义颜色停止。rgba()函数中的最后一个参数可以是0到1之间的值,它定义颜色的透明度:0表示完全透明,1表示全彩(无透明)。以下示例显示从左侧开始的线性渐变。它开始完全透明,过渡到全彩红色: -
重复线性渐变
repeating-linear-gradient()函数用于重复线性渐变: -
-
设置形状
shape参数定义形状。它可以取值circle(圆)或ellipse(椭圆)。默认值为ellipse。以下示例显示了具有圆形形状的径向渐变: -
-
重复径向渐变
repeating-radial-gradient()函数用于重复径向渐变: -
CSS渐变属性
下表列出CSS渐变属性单位 描述 background-image 为元素设置一个或多个背景图像 -
相关页面
HTML教程:HTML样式