主要知識點：radial-gradient

radial-gradient() CSS 函數(shù)創(chuàng)建一個圖像，該圖像由從原點輻射的兩種或多種顏色之間的漸進過渡組成。它的形狀可以是圓形或橢圓形。函數(shù)的結(jié)果是  數(shù)據(jù)類型的對象。這是一種特別的 。

.coupon{
    width: 190rpx;
	height: 194rpx;
	background-color: #bbb;
	border-radius: 14rpx;
	color: #fff;
	margin-right: 20rpx;
	display: inline-block;
	-webkit-mask: radial-gradient(circle at 10rpx 134rpx, transparent 10rpx, red 0) -10rpx;
	background-color: #d6b16c;
}

.coupon {
		width: 284rpx;
		height: 140rpx;
		background-color: #bbb;
		border-radius: 8rpx;
		color: #fff;
		position: relative;
		display: inline-block;
		position: relative;
		background-image: 
			radial-gradient(circle at 220rpx top, #fff, #fff 10rpx, transparent 11rpx),
			radial-gradient(circle at 220rpx bottom, #fff, #fff 10rpx, transparent 11rpx);
}