我正在尝试建立一种进度条，类似于Chris Coyier在这里所做的操作：https ://css-tricks.com/css3-progress-bars/ ，不同之处在于我想将SVG剪切路径应用于周围div元素。
例如，我想将SVG剪切路径应用于.rating-stars：
<div class="rating-stars">
<span class="rating"></span>
</div>
您可以在此处查看到目前为止的内容：http : //codepen.io/rleichty/pen/GrWmRR
由于某些原因，它在Safari中不起作用，我也不确定如何调整SVG剪切路径的大小（如果可能的话）。
有谁知道我将如何做到这一点，或者有更好的解决方案？