---恢复内容开始---
- 渐变 gradients
水平渐变 linear gradients
语法 background:linear-gradient(direction,color1,color2,……)
Direction
- 这个参数可以省略 如果省略了默认方向是从上到下
- 这个参数如果不省略 写方向的起始值 top(从上到下) left(从左到右) right(从右到左)
- 如果这个参数不省略 这个属性前面需要加前缀或者是 to 终点方向
- 对角渐变
- 角度 deg 0代表从下到上 90deg代表从左到右,
- 渐变的过程
0% 在0%处 是纯红色 20%是纯蓝色 如果最后一个值不是100% 代表从这个值到100%都是纯orange,如果最后一个值是100% 在100%处是纯橙色。
在起点如果不是0 是10% 从到10%处都是纯红色
径向渐变radial gradients
起点是中心点,向四周渐变
Background:radial-gradient(shape,color,color)
- Shape
参数可以省略 如果省略默认是ellipse椭圆形 还有个值是circle 代表圆
- 渐变过程
0% 在0%处 是纯红色 20%是纯蓝色 如果最后一个值不是100% 代表从这个值到100%都是纯orange,如果最后一个值是100% 在100%处是纯橙色。
在起点如果不是0 是10% 从到10%处都是纯红色
版权声明:除特别声明外,本站所有文章皆是本站原创,转载请以超链接形式注明出处!
Tags:
CSS3