Base64 エンコーディングを使用して CSS スタイルシートに PNG 画像を埋め込む方法

Base64 エンコーディングを使用した CSS スタイルシートへの PNG 画像の埋め込み

データ URI を使用して CSS スタイルシートに PNG 画像を含めるには、それらを次のように変換する必要があります。 Base64エンコーディング。これを実現する方法は次のとおりです:

macOS と Linux では、次のコマンド ライン メソッドを使用できます:

base64 filepath > filepath.b64

あるいは、より汎用性の高いアプローチとして Python を使用できます:

<code class="python">import base64

binary_fc = open(filepath, 'rb').read()
base64_utf8_str = base64.b64encode(binary_fc).decode('utf-8')

ext = filepath.split('.')[-1]
dataurl = f'data:image/{ext};base64,{base64_utf8_str}'</code>

この Python ソリューションでは、decode('utf-8') によって最新のブラウザーとの互換性が確保されており、プレフィックス data:image/{ext};base64 は画像形式とエンコーディングを識別するために不可欠です。

以上がBase64 エンコーディングを使用して CSS スタイルシートに PNG 画像を埋め込む方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。