Question

我正在通过img标签使用SVG，它不想通过Firefox＆amp; IE浏览器。这是测试网站。

您可以通过搜索名为＆＃34; mask＆＃34;的类来在html中找到SVG。通过标签将SVG直接放在我的html中。这也是它的直接链接。

我已经看过人们经历过的40-50个类似的问题，但还没有找到解决方案。不知道为什么它不会加载。

Answer 1

如果删除position: absolute;并稍微调整边距，则在所有三种浏览器中都可以正常工作。

.main-container .main-bg img.mask {
    bottom: 0;
    margin-bottom: -7px;
    opacity: 1;
    width: 101%;
}

我怀疑使用margin-bottom将其向下移动的替代方法是在SVG上设置preserveAspectRatio="xMidYMax meet"。这将迫使它坐在视口的底部，而不是像现在一样垂直居中（我认为这是导致间隙的原因）。

Answer 2

在images文件夹中添加.htaccess解决了我的问题，因为服务器不支持SVG。

AddType image/svg+xml svg svgz
AddEncoding gzip svgz