Rumah  >  Artikel  >  pembangunan bahagian belakang  >  Bagaimana untuk membenamkan imej .png terus ke dalam dokumen HTML tanpa memaut ke fail luaran?

Bagaimana untuk membenamkan imej .png terus ke dalam dokumen HTML tanpa memaut ke fail luaran?

DDD
DDDasal
2024-10-28 21:30:30567semak imbas

How to embed a .png image directly into an HTML document without linking to an external file?

Membenamkan Imej .png ke dalam Halaman HTML

Bagaimana seseorang boleh membenamkan fail .png ke dalam dokumen "file.html" kosong supaya imej dipaparkan apabila fail dibuka dalam mana-mana penyemak imbas, tanpa memautkannya daripada kod HTML?

Jawapan:

Untuk membenamkan imej ke dalam HTML tanpa memaut, menggunakan pengekod Base64 dalam talian. Satu pilihan yang disyorkan ialah http://www.greywyvern.com/code/php/binary2base64.

Terdapat dua kaedah utama untuk membenamkan imej:

  • CSS:
div.image {
  width: 100px;
  height: 100px;
  background-image: url(data:image/png;base64,iVBORwA<MoreBase64StringHere>);
}
  • Teg:
<img alt="My Image" src="data:image/png;base64,iVBORwA<MoreBase64StringHere>" />

Dalam kedua-dua kes, gantikan dengan output daripada pengekod Base64.

Atas ialah kandungan terperinci Bagaimana untuk membenamkan imej .png terus ke dalam dokumen HTML tanpa memaut ke fail luaran?. 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