Bootstrap を使って画像をレスポンシブに表示する - CrossBridge Lab
はじめに 本記事では Bootstrap3 を使った時に、画像をレスポンシブに表示する方法と、レスポンシブに表示しつつセンターに表示される方法を解説します。 Bootstrap で画像をレスポンシブに表示する img 要素に img-responsive クラスを指定すると、画像がレスポンシブ対応となり、親の要素に合わせて拡大縮小されます。 <img src="image.jpg" class="img-responsive"> img-responsive クラスですが、BootstrapのCSSファイルで以下のように定義されています。 .img-responsive { display: block; height: auto; max-width: 100%; } before & after before after 画像をレスポンシブに表示しつつセンタリングする img-resp
Bootstrapでレスポンシブ対応やグリッドシステムを秒で実現
とりあえず、最近の沖縄の夜と朝の寒暖差に体調崩しがち なのは、僕だけではない、、、はず。 PM１１時くらいに薄着で寝ると、朝方の寒さに やられるわけです。恐ろしい話です。 それは、そーと今回は整ったサイトを作るための技術Bootstrapをご紹介。 Bootstrapとは Bootstrapというのは簡単にサイトか作成できるcssフレームワークです。 フレームワークってなんぞや？ 日本語でざっくり訳すと枠組みということです。 ある決まりにしたがってコードを書くと、簡単に整った サイトを構築することが可能です。 Bootstrapはどこで利用されているの？ 今回利用するBootstrapはcssフレームワークでは 世界中で広く利用されています。 例えば EC-CUBE 主に日本国内で開発されている、ECサイト構築用プログラムです。 フロントデザインにBootstrapを利用していて、店舗の特
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
