Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Mengekodkan Imej PNG sebagai Base64 untuk URI Data CSS?

Bagaimana untuk Mengekodkan Imej PNG sebagai Base64 untuk URI Data CSS?

Patricia Arquette
Patricia Arquetteasal
2024-10-30 21:22:30995semak imbas

How to Encode PNG Images as Base64 for CSS Data URIs?

Menggunakan Pengekodan Base64 untuk Imej PNG dalam URI Data CSS

Untuk membenamkan imej PNG ke dalam lembaran gaya CSS menggunakan URI data, data PNG mesti terlebih dahulu dikodkan ke dalam format Base64. Teknik ini membenarkan fail imej luaran dimasukkan terus dalam lembaran gaya.

Penyelesaian Baris Perintah Unix:

base64 -i /path/to/image.png

Arahan ini akan mengeluarkan PNG yang dikodkan Base64 data.

Penyelesaian Python:

<code class="python">import base64

with open("/path/to/image.png", "rb") as f:
    binary_data = f.read()

base64_data = base64.b64encode(binary_data).decode("utf-8")
ext = "png"

data_uri = f"data:image/{ext};base64,{base64_data}"

print(data_uri)</code>

Skrip Python ini membaca fail PNG dalam mod binari, menukarnya kepada Base64 dan kemudian membina URI data, termasuk jenis dan sambungan MIME yang sesuai.

Nota Tambahan:

  • Pastikan sambungan imej disertakan dalam URI data selepas jenis MIME, mis., "data :image/png;base64".
  • Gunakan kaedah "decode('utf-8')" dalam Python untuk mengendalikan sebarang isu berkaitan Unicode yang berpotensi.

Atas ialah kandungan terperinci Bagaimana untuk Mengekodkan Imej PNG sebagai Base64 untuk URI Data CSS?. 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