小编Jak*_*das的帖子

缩放时,IE11中的SVG背景会被切断

我们正试图在Internet Explorer中显示SVG背景.当使用100%以外的变焦时,我们的图像总会被切断.可以使用以下代码重现:

用这个svg

<svg xmlns="http://www.w3.org/2000/svg" height="100" width="100" viewBox="0 0 100 100">
  <circle cx="50" cy="50" r="48" stroke="black" stroke-width="3" fill="red" />
</svg>
Run Code Online (Sandbox Code Playgroud)

div {
  width: 14px;
  height: 14px;
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;charset=utf-8,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' height='100' width='100' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='48' stroke='black' stroke-width='3' fill='red'%3E%3C/circle%3E%3C/svg%3E");
}
Run Code Online (Sandbox Code Playgroud)
<div></div>
Run Code Online (Sandbox Code Playgroud)

结果如下:

在此输入图像描述

在所有其他浏览器中它渲染得很好.还有其他人遇到过这个bug吗?有解决方法吗?

svg internet-explorer-11

5
推荐指数
1
解决办法
1523
查看次数

标签 统计

internet-explorer-11 ×1

svg ×1