小编Kev*_*ass的帖子

在Firefox中的SVG背景

在我朋友的网站上工作,我无法弄清楚如何在Firefox中显示SVG.在Edge中,当我调整浏览器大小时,它也会消失.

http://lene.isreborn.com/
Run Code Online (Sandbox Code Playgroud)

CSS - (我必须使用重要因为它是Wordpress):

header::after {
    content:"";
    display: block;
    background: url(/svg-filer/header-background.svg);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left:-1%;
    width: 102% !important;
    height: 90px !important;
    position: absolute;
    z-index: -1;

    -ms-transition: top ease .5s;
    -moz-transition: top ease .5s;
    -webkit-transition: top ease .5s;
    transition: top ease .5s;
}

header.sticky-active::after { 
    top: -20px;
}
Run Code Online (Sandbox Code Playgroud)

SVG文件:

  <?xml version="1.0" encoding="utf-8"?>
    <!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
         width="100%" height="90px" viewBox="0 0 1920 …
Run Code Online (Sandbox Code Playgroud)

css firefox svg pseudo-element microsoft-edge

6
推荐指数
2
解决办法
2664
查看次数

标签 统计

css ×1

firefox ×1

microsoft-edge ×1

pseudo-element ×1

svg ×1