画像にbase64をかけてhtmlやCSSに埋め込む | Branberyheag!! Lab

学びカテゴリーの変更を依頼記事元:

lab.branberyheag.com

3 usersがブックマークコメント

記事へのコメント0件

注目コメント
新着コメント

新着コメントはまだありません。
このエントリーにコメントしてみましょう。

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

リンクを埋め込む

以下のコードをコピーしてサイトに埋め込むことができます

<iframe marginwidth="0" marginheight="0" src="https://b.hatena.ne.jp/entry.parts?url=http%3A%2F%2Flab.branberyheag.com%2F2011%2F10%2F26%2F%25E7%2594%25BB%25E5%2583%258F%25E3%2581%25ABbase64%25E3%2582%2592%25E3%2581%258B%25E3%2581%2591%25E3%2581%25A6html%25E3%2582%2584css%25E3%2581%25AB%25E5%259F%258B%25E3%2582%2581%25E8%25BE%25BC%25E3%2582%2580.html" scrolling="no" frameborder="0" height="230" width="500"><div class="hatena-bookmark-detail-info"><a href="http://lab.branberyheag.com/2011/10/26/%E7%94%BB%E5%83%8F%E3%81%ABbase64%E3%82%92%E3%81%8B%E3%81%91%E3%81%A6html%E3%82%84css%E3%81%AB%E5%9F%8B%E3%82%81%E8%BE%BC%E3%82%80.html">画像にbase64をかけてhtmlやCSSに埋め込む | Branberyheag!! Lab</a><a href="https://b.hatena.ne.jp/entry/lab.branberyheag.com/2011/10/26/%E7%94%BB%E5%83%8F%E3%81%ABbase64%E3%82%92%E3%81%8B%E3%81%91%E3%81%A6html%E3%82%84css%E3%81%AB%E5%9F%8B%E3%82%81%E8%BE%BC%E3%82%80.html">はてなブックマーク - 画像にbase64をかけてhtmlやCSSに埋め込む | Branberyheag!! Lab</a></div></iframe>

プレビュー

規約違反を報告

いまの話題をアプリでチェック！

バナー広告なし
ミュート機能あり
ダークモード搭載

アプリをダウンロード

画像にbase64をかけてhtmlやCSSに埋め込む | Branberyheag!! Lab

画像にbase64（Data URIs）をかけてHTMLやCSSに埋め込む方法って、知らなかった。。。HTTPリクエストを... 画像にbase64（Data URIs）をかけてHTMLやCSSに埋め込む方法って、知らなかった。。。HTTPリクエストを減らせるので、軽量化に役に立ちそうだったので、メモ。 <img src="http://hogehoge.jp/hoge.png"> と書いていたものを <img src="data:image/png;base64,iVBORw0KGgo...."> と書けるようだ。オンラインツールでひとつひとつ変換するのもいいけど、PHPで変換すればアップロードのみで対応ができそう。 <?php $img = file_get_contents( 'http://hogehoge.jp/hoge.png' ); if ( $img !== false ) { $img = base64_encode( $img ); } ?> 上記はあくまでもサンプルだけど、これを関数にしてht