其他分享
首页 > 其他分享> > CSS篇径向渐变 background-image: radial-gradient

CSS篇径向渐变 background-image: radial-gradient

作者:互联网

radial-gradient([<>]? [<形状> || <大小>,]? <点>, <点>…);起点
起点:可以是关键字(left,top,right,bottom),具体数值或百分比
形状: ellipse、circle
大小 :具体数值或百分比,也可以是关键字
(最近端,最近角,最远端,最远角,包含或覆盖 (closest-side, closest-corner, farthest-side, farthest-corner, contain or cover));

		形状和起点之间用at链接

radial-gradient代码展示

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			div{
				width: 400px;
				height: 400px;
				border: 10px solid #000;
				background-image: radial-gradient(circle at left top, red, blue);
			}
		</style>
		 
	</head>
	<body>
		<div>
			
		</div>
		加wx   wzq85006194
	</body>
</html>

标签:farthest,closest,gradient,image,background,radial,corner
来源: https://blog.csdn.net/weixin_42497127/article/details/121498386