TUTORIAL前端与浏览器FETCHED
CSS repeating-conic-gradient() 函数
CSS repeating-conic-gradient() 函数 CSS 函数 实例 创建一个重复的圆锥渐变： [mycode3 type='css'] #grad { background-image: repeating-conic-gradient(red 10%, yellow 20%); } [/mycode3] 尝试一下 » 定义与用法 repeating-conic-gradien..
更新于 2026/7/16
教程详情页默认 noindex。
CSS repeating-conic-gradient() 函数
CSS 函数定义与用法
repeating-conic-gradient() 函数用于创建一个重复的圆锥渐变。
支持版本：CSS3
浏览器支持
表格中的数字表示支持该函数的第一个浏览器版本号。
| 函数 | |||||
|---|---|---|---|---|---|
| repeating-conic-gradient() | 69.0 | 79.0 | 83.0 | 12.1 | 56.0 |
CSS 语法
background-image: repeating-conic-gradient([from angle] [at position,] color degree, color degree, ...);
| 值 | 描述 |
|---|---|
| from angle | 可选。起始角度。默认值为 0deg。 |
| at position | 可选。中心位置。默认居中。 |
| color degree, ..., color degree | 角渐变断点。该值包含一个颜色值，后跟一个可选的停止位置（ 0 到 360 之间的度数或 0% 到 100% 之间的百分比）。 |
更多实例
实例
设置开始颜色和停止颜色的重复圆锥渐变：：
#grad {
background-image: repeating-conic-gradient(red 0deg 30deg, yellow 30deg 60deg, blue 60deg 90deg);
}
尝试一下 »