有没有人知道如果以下图像可以在CSS中制作？光线和暗线可以而且应该是相等的宽度和边缘渐渐变暗，使整体背景是深色(在这种情况下是深蓝色)。
任何帮助都非常感激。我的谷歌技能没有提供任何这种效果的帮助，只有“starburst贴纸/徽章的东西”被发现。
解决方法
不，不幸的是，css3生成的图像规格不包括锥形/角度梯度(尽管它们可能在下一个修订版本中出现)，这将是使用仅使用CSS的最有可能的方法。但是，您可以使用css svg来执行此操作。我实际上有一个这样的svg文件坐在我曾经做过的一个实验中：
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="512px" height="512px" viewBox="-256 -256 512 512" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink"> <title>Burst</title> <defs> <g id="burst"> <g id="quad"> <path id="ray" d="M0,0 -69,-500 69,-500 z" /> <use xlink:href="#ray" transform="rotate(30)"/> <use xlink:href="#ray" transform="rotate(60)"/> <use xlink:href="#ray" transform="rotate(90)"/> </g> <use xlink:href="#quad" transform="rotate(120)"/> <use xlink:href="#quad" transform="rotate(240)"/> </g> <radialGradient id="grad" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" stop-color="white" stop-opacity="0.65"/> <stop offset="100%" stop-color="black" stop-opacity="0.65"/> </radialGradient> <!-- a circle mask --> <mask id="m"><circle r="256" fill="white"/></mask> </defs> <!-- added a mask and scaled it to a different aspect ratio below. scale(x,y) --> <g mask="url(#m)" transform="scale(1,0.75)"> <use xlink:href="#burst" fill="lightslateblue"/> <use xlink:href="#burst" fill="darkslateblue" transform="rotate(15)"/> <circle r="360px" fill="url(#grad)" /> </g> </svg>
将其设置为您的背景图像，并设置CSS的background-size：cover。而已。 Here’s a fiddle在数据网址中使用此图像。
