Rumah >hujung hadapan web >tutorial css >Mengapa Imej Latar Belakang URL Data SVG Saya Tidak Dipaparkan dalam Firefox?

Mengapa Imej Latar Belakang URL Data SVG Saya Tidak Dipaparkan dalam Firefox?

Barbara Streisand
Barbara Streisandasal
2024-12-25 21:07:11253semak imbas

Why Doesn't My SVG Data URL Background Image Display in Firefox?

Imej Latar Belakang URL Data SVG Tidak Dipaparkan dalam Firefox

Apabila menetapkan SVG sebagai imej latar belakang menggunakan URL data dalam bentuk pseudo elemen, imej gagal dipaparkan dalam Firefox. Ini kerana Firefox menganggap aksara '#' dalam URL sebagai permulaan pengecam serpihan.

Untuk menyelesaikan isu ini, kandungan URL data mestilah dikodkan URL. Ini melibatkan penukaran mana-mana aksara '#' kepada '#'. Kod CSS yang diubah suai di bawah menggabungkan pengekodan URL:

content: '';
position: absolute;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 12px;
background-image: url('data:image/svg+xml;utf8,%3Csvg version="1.1">

Dengan pengekodan URL kandungan URL data, Firefox mentafsir aksara cincang dengan betul sebagai sebahagian daripada data SVG, membenarkan imej dipaparkan sebagai latar belakang.

Atas ialah kandungan terperinci Mengapa Imej Latar Belakang URL Data SVG Saya Tidak Dipaparkan dalam Firefox?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn