我已经寻找并尝试了几天，但似乎无法完全做到100％正确... 我正在尝试使用css3渐变实现以下效果：
我最接近的方法是DEMO：
html {
background:
linear-gradient(80deg, transparent 50%, #ddd 50%, #ddd),
linear-gradient(90deg, transparent 50%, #ddd 50%, #ddd),
linear-gradient(82deg, transparent 50%, #eee 50%, #eee),
linear-gradient(67deg, transparent 50%, #ddd 50%, #ddd),
linear-gradient(52deg, transparent 50%, #eee 50%, #eee),
linear-gradient(37deg, transparent 50%, #ddd 50%, #ddd),
linear-gradient(22deg, transparent 50%, #eee 50%, #eee),
linear-gradient(7deg, transparent 50%, #ddd 50%, #ddd),
linear-gradient(-8deg, transparent 50%, #eee 50%, #eee),
linear-gradient(-23deg, transparent 50%, #ddd 50%, #ddd),
linear-gradient(-38deg, transparent 50%, #eee 50%, #eee),
linear-gradient(-53deg, transparent 50%, #ddd 50%, #ddd),
linear-gradient(-68deg, transparent 50%, #eee 50%, #eee),
linear-gradient(-83deg, transparent 50%, #ddd 50%, #ddd);
background-position: center -100%;
background-color: #eee;
background-size: 100% 200%;
min-height: 100%;
}我会继续尝试...虽然非常感谢任何帮助。
更新：
必须有更好/可重用的方法来解决这个问题...正在研究scss解决方案，以下是我目前的进展：
.sunburst {
@for $ray from 1 through 26 {
$color: #eee;
$degree: 7;
@if $ray%2 == 0 {
$color: #ddd;
}
background:linear-gradient($degree+deg, transparent 50%, $color 50%, $color),
}
}
现在我只是试图弄清楚它背后的实际数学...试图从 pow.js 中窃取逻辑，但如果你像我一样对数学很糟糕的话，这有点困难...