颜色渐变标准语句

原文链接: https://www.mk2048.com/blog/blog.php?id=h0k10aj02bbb&title=%E9%A2%9C%E8%89%B2%E6%B8%90%E5%8F%98%E6%A0%87%E5%87%86%E8%AF%AD%E5%8F%A5

/* 默认从上至下渐变*/
background: linear-gradient(red,blue);

/* 从左到右渐变*/
background: linear-gradient(to right,red,blue);

/* 从左上角到右下角渐变*/
background: linear-gradient(to bottom right,red,blue);

/*从上至下渐变 详见图角度变换*/
background: linear-gradient(180deg,red,blue);

/* 颜色节点变换 颜色从左向右 方向默认*/
background: linear-gradient(red, green, blue);

/*一个带有彩虹颜色和文本的线性从线性渐变 indigo 靛蓝 voilet 紫罗兰*/
background: linear-gradient(to right, red,orange,yellow,green,blue,indigo,violet);

/* rgba() 函数来定义颜色结点。rgba() 函数中的最后一个参数可以是从 0 到 1 的值,它定义了颜色的透明度:0 表示完全透明,1 表示完全不透明。*/
background: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1));

/*重复线性渐变 重复相同的线性渐变直到充满整个屏幕*/
background: repeating-linear-gradient(45dge, red, yellow 10%, green 20%);

/*圆形渐变*/
background: radial-gradient(red 10%,blue 90%)


<!--阴影常用值-->
box-shadow: 5px 5px 15px #b0adad;


更多专业前端知识,请上 【猿2048】www.mk2048.com

猜你喜欢

转载自blog.csdn.net/qq_45670012/article/details/102774940