【发布时间】：2016-12-01 05:28:24
【问题描述】：
我创建了具有图案图像的药丸 svg。它在 FF、IE、Edge 中看起来很完美，但在 Chrome、Opera（webkit 浏览器）中图像被截断。这个问题也出现在 Mac 的 Safari 和 firefox 上。 这是codepen中的示例：http://codepen.io/reinis/pen/wWXdbz
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 240 240">
<defs>
<pattern id="imgpattern" x="0" y="0" width="1" height="1">
<image width="240" height="240" xlink:href="http://www.vrheadsets3d.com/wp-content/uploads/2016/07/dreams-of-dali-400x400.jpg"/>
</pattern>
</defs>
<path fill="url(#imgpattern)" d="M17.654,17.654C-5.93,41.238-5.878,79.528,17.77,103.176l59.448,59.448l59.606,59.606c23.648,23.648,61.938,23.7,85.522,0.116s23.532-61.874-0.116-85.522l-59.488-59.488L103.176,17.77 C79.528-5.878,41.238-5.93,17.654,17.654z" />
</svg>
谁能弄清楚发生了什么？
【问题讨论】：
标签： svg