外部ファイルにリンクせずに .png 画像を HTML ドキュメントに直接埋め込むにはどうすればよいですか?

HTML ページへの .png 画像の埋め込み

空の "file.html" ドキュメントに .png ファイルを埋め込むにはどうすればよいですかファイルをブラウザで開いたときに、HTML コードからリンクせずに画像が表示されるようにするには?

回答:

画像を HTML に埋め込むには、リンクするには、オンライン Base64 エンコーダを利用します。推奨されるオプションの 1 つは、http://www.greywyvern.com/code/php/binary2base64 です。

画像を埋め込むには、主に 2 つの方法があります:

• CSS:

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

• タグ:

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

どちらの場合も、 を置き換えます。 Base64 エンコーダーからの出力を使用します。

以上が外部ファイルにリンクせずに .png 画像を HTML ドキュメントに直接埋め込むにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。