Kodkan PNG kepada Base64 untuk CSS
Ubah imej PNG kepada format Base64 atau DataURL. Tampal terus ke dalam CSS atau JavaScript tanpa fail luar. Fail yang lebih besar mungkin menjejaskan prestasi; saiz yang lebih kecil disyorkan. Pengkodan Base64 memudahkan penyepaduan dengan aset web, mengurangkan pergantungan pada sumber luaran. Format DataURL menyederhanakan struktur kod untuk penghantaran kandungan dinamik.
Image → Base64 / Data URL
Tukarkan Imej kepada Kod Base64
Muat naik imej PNG
Muat naik imej PNG anda dengan mengklik atau seret ke kawasan muat naik.
Pilih Format Pengkodan
Pilih tab 'Base64' atau 'DataURL' untuk memilih format pengkodan yang anda inginkan.
Lihat Data Base64
Representasi Base64 atau DataURL gambar anda akan muncul dalam kawasan teks di bawah tab.
Salin Teks Terenkode
Klik butang 'Salin' untuk menyalin teks yang disulitkan ke papan klip anda untuk kegunaan dalam CSS atau JavaScript anda.
Sematkan PNG terus dalam CSS anda
Menyertakan gambar kecil secara langsung dalam CSS tanpa menguruskan fail berasingan boleh dicapai dengan menukarkan PNG kepada format Base64 atau DataURL. Alat tukar PNG kepada Base64 untuk CSS memudahkan aliran kerja pembangunan web anda dan mengurangkan permintaan HTTP. Ini menghasilkan kod yang lebih bersih, lebih cekap, dan masa muat halaman yang lebih cepat.
Kurangkan Saiz Fail dan Permintaan HTTP
Alat ini mengurangkan jumlah fail yang diperlukan untuk dimuatkan oleh laman web anda dengan menukarkan imej PNG kepada format Base64 atau DataURL. Menyemak imej terus ke dalam CSS atau JavaScript anda mengurangkan permintaan HTTP, yang boleh meningkatkan kelajuan pemuatan halaman. Pendekatan ini mengoptimumkan prestasi laman web dengan meminimkan ketergantungan pada fail luaran.
Soalan Lazim
Apakah itu DataURL Base64 dan mengapa saya akan menggunakannya?
DataURL Base64 ialah cara untuk mewakili imej sebagai rentetan aksara. Ia membolehkan anda menyemak imej terus ke dalam kod CSS atau JavaScript anda, mengelakkan keperluan untuk memuat turunnya daripada fail luaran. Ini boleh berguna untuk ikon atau imej kecil.
Bagaimana saya menggunakan Base64 atau DataURL yang dijana?
Salin sahaja kod yang disediakan selepas menukar imej anda dan tampalkannya ke dalam CSS atau JavaScript anda. Contohnya, dalam CSS, anda boleh menggunakannya seperti ini: background-image: url('data:image/png;base64,...');
Format imej apa yang disokong oleh alat ini?
Alat ini direka khusus untuk imej PNG. Format lain mungkin tidak ditukar dengan betul.
Mengapakah imej bersaiz besar tidak disyorkan?
Gambar-gambar bersaiz besar menghasilkan rentetan Base64 yang sangat panjang, yang boleh memperlahankan komputer anda dan meningkatkan masa muatan halaman. Sebaiknya gunakan alat ini untuk gambar-gambar yang lebih kecil.
Adakah had kepada saiz gambar yang boleh saya muat naik?
Walaupun tiada had saiz fail yang ketat, prestasi akan merosot dengan imej yang lebih besar. Kami cadangkan menggunakan fail PNG yang lebih kecil untuk hasil yang terbaik.