background:url('')center center / cover no-repeat fixed;
height: 100vh;
vhはviewport heightでビューポートの高さに対する割合を指定する単位です。
vwはviewport widthでビューポートの幅に対する割合です。
知らない単位だったけど、やりたいこと出来た！
投稿日：2017年4月28日 更新日：
画面の縦幅いっぱいに背景画像を表示する
画面全体に背景画像を表示するには、
background:url('画像を指定');
background-size:cover;
でできますが、
いやいや、一画面だけでなくその下にもコンテンツがあってそこには背景画像をつけたくないんだよって時に指定する方法です。
関連記事
-
-
タイトルの背景を斜めボーダーにしたい 斜めボーダー背景。 色の組み合わせで色々な雰囲気がつくれる。 ただ、背景に柄が入ると中のテキストが読みにくくなるので、色は注意！ HTMLは入れ子にしています。 ...
-
-
WordPress と Facebookの連携が表示されない原因
dddwordpressのテーマ「xeory_extension」を使っていた時 初期設定でいくつかの項目を入力するとfacebookとの連携ができるようになってたのでテストサイトで設定項目を入力する ...
-
-
JQueryなしで動く"Swiper"という便利なプラグインを使ってのスライドショー。 左右に画像を表示したい時の注意点をメモ。 ダウンロードはこちらから swiper公式サイト 使う中ですごく分かり ...
-
-
サイト作成の時にメニューアイコンを作っていたけど 3つのメニューのうち1つをアイコンフォント使ってたら表示の鮮明さに驚いた。 他のアイコンはpng形式の画像だったけど全然違う。 通常、画像でできたアイ ...
-
-
display:flexを使った時のIE10のバグに対応する
display:flex;を使った時、IE11では問題なくてもIE10で見ると色々な不具合が生じることが多い。例えば、このサイトのレイアウト。クロームで見るとこんな感じまぁまぁ均等に並んでいるように見 ...
- PREV
- cssでlistのborderを斜め線にする
- NEXT
- サンプルサイト制作
