渐变的定义:背景颜色过渡的效果
【线性渐变】常用
属性:background-image: linear-gradient();
渐变方向:在括号在加to top 或者left 或者right left 默认就从上到下
渐变角度:0deg是从下面开始渐变 度数是正值是顺时针 负值是逆时针
颜色可以多个但是要逗号隔开
可以加渐变的百分比,加在颜色的后面
注:比如红25% 蓝75% 红色是从25%处开始渐变到75%成蓝色,
25%之前是纯红色。
加浏览器内核时:方向没有to 直接left...... 两个方向的时候,浏览器加内核的识别标准根同一标准不一样
径向渐变】不常用
属性:background-image: radial-gradirnt()
从中心点向四周渐变 默认为椭圆状 也可以多个颜色和百分比
在添加百分比时,要从小到大顺序
-webkit-radial-gradient(方位,颜色)
重复渐变:repeating【颜色必须跟百分比,否则无法形成重复渐变的效果】
circle 表示圆形 ellipse 表示椭圆形。
语法:
重复的线性渐变 repeating-linear-gradient()
重复的径向渐变 repeating-linear-gradient()