Recent posts:

パソコンについての使いこなし情報や便利な情報を紹介

CSSで背景画像をウィンドウサイズに合わせて表示したい

2015/11/30 06:30

Webサイト作成時に背景画像を画面全体に表示する際、ウィンドウをリサイズしても全体に表示させる方法のメモ。

CSS3を使って画像をウィンドウサイズに合わせる

ただ単に背景画像を指定するだけではうまく表示できないため(←当たり前ですが)、いろいろと検索した結果、次のようにすれば背景画像をウィンドウに合わせて全画面で表示できました。

background-sizeは背景画像のアスペクト比を維持してくれますが、それだけではFirefoxで試すと縦方向に余白ができてしまいました。

どうやらmin-heightが重要らしく、この指定があることで余白がなくなり、ウィンドウをリサイズしても追従してくれるようになりました。

Pocket

コメント

Twitter

【更新しました】
あけましておめでとうございます (2017) - PC雑記帳
http://zakkiweb.net/a/54/

2017/01/01 00:02

【更新しました】
Let's Encryptで自動更新をするメモ - PC雑記帳
http://zakkiweb.net/a/53/

2016/12/30 16:37

【更新しました】
価格が安く汎用性がありそうな新ドメインを検討する - PC雑記帳
http://zakkiweb.net/a/52/

2016/11/28 20:02