Wie kann ich ein PNG-Bild direkt in ein HTML-Dokument einbetten, ohne eine Verknüpfung zu einer externen Datei herzustellen?

Einbetten eines .png-Bildes in eine HTML-Seite

Wie kann man eine .png-Datei in ein leeres „file.html“-Dokument einbetten? damit das Bild angezeigt wird, wenn die Datei in einem beliebigen Browser geöffnet wird, ohne vom HTML-Code aus darauf zu verlinken?

Antwort:

Ein Bild in HTML einbetten ohne Für die Verknüpfung nutzen Sie Online-Base64-Encoder. Eine empfohlene Option ist http://www.greywyvern.com/code/php/binary2base64.

Es gibt zwei Hauptmethoden zum Einbetten des Bildes:

• CSS:

div.image {
  width: 100px;
  height: 100px;
  background-image: url(data:image/png;base64,iVBORwA<MoreBase64StringHere>);
}

• Tag:

<img alt="My Image" src="data:image/png;base64,iVBORwA<MoreBase64StringHere>" />

Ersetzen Sie in beiden Fällen mit der Ausgabe des Base64-Encoders.

Das obige ist der detaillierte Inhalt vonWie kann ich ein PNG-Bild direkt in ein HTML-Dokument einbetten, ohne eine Verknüpfung zu einer externen Datei herzustellen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!