<html>
<head>
<style>
#grad1 {
height: 200px;
width: 200px;
background-color: red; /* 对于不支持渐变的浏览器,显示红色背景 */
background-image: repeating-conic-gradient(red 0deg 30deg, yellow 30deg 60deg, blue 60deg 90deg);
border-radius: 50%; /* 边框圆角为 50%,形成圆形 */
}
</style>
</head>
<body>
<h1>重复的锥形渐变</h1>
<div id="grad1"></div>
</body>
</html>