css渐变

一透明(opacity)

设置元素的透明度

取值范围 0-1

1) 0 是完全透明

2) 1 是完全不透明

IE滤镜 filter:alpha(opacity=0-100)

1) 0 是完全透明

2) 100是完全不透明

二.渐变(gradient)

用在所有接受图像的属性上

线性渐变linear-gradient不加兼容前缀

1) 第一个参数:起点 到什么方向开始渐变① to left / to right / to top / to bottom② to top left / to top right / to bottom right / to bottom left ③ 角度:deg(0deg = to top) 顺时针旋转

2) 第二个参数颜色 位置什么颜色在那个位置开始发生渐变效果

background-image:linear-gradient(totop,red10%,#00f100%);

线性渐变加兼容前缀

1) 第一个参数:起点 从什么方向开始① left / right / top / bottom② top left / top right / bottom right bottom left③ 角度:deg(0deg = left) 逆时针旋转

background-image:-webkit-linear-gradient(left,red0%,#00f100%);

径向渐变radial-gradient

1) 第一个参数:形状① circle 圆 / ellipse 椭圆2)第二个参数:半径①圆只有一个半径,椭圆有两个②closest-slid 圆心到最近的边 / farthest-slid 圆心到最远的边③closest-corner 圆心到最近的角 / farthest-corner 圆心到最远的角④像素值,百分数3) 第三个参数:圆心的位置①关键词 left / right / center / top / bottom②第四个参数:颜色 位置

background-image:radial-gradient(ellipse100%100%atcenter,#f0010%,#ff020%,#080100%);

渐变平铺repeating-渐变属性