css - CSSのインラインSVGフィルター

Question

この質問を読んだ後: CSS のインライン SVG (Firefox と Chrome で完全に動作します)

body { background-image: 
        url("data:image/svg+xml;utf8,<svg>........</svg>");
      }

私はいくつかのフィルター効果を適用しようとしました

filter: url("data:image/svg+xml;utf8,<svg>........</svg>#filter01")

FF では動作しましたが、Chrome では動作しませんでした。

何が原因で、どうすれば修正できますか?

Answer 1

次のように、データ文字列でエスケープを使用してみてください

filter: url("data:image/svg+xml;utf8,%3Csvg%3E........%3C/svg%3E#filter01")

Answer 2

私はあなたがそれを修正できるとは思わない。これは Firefox でのみ完全にサポートされており、この使用法は *-filter プロパティに置き換えられます。