こんにちは。
１年生前期最後のブログ更新になりました。最初は学校に馴染めませんでしたが、段々と慣れてきて安心しています。
今回の記事は「ページ全体の背景画像の設定方法」について書きたいと思います。
背景画像を固定する場合
このように、背景画像を付けたい要素（今回はbody）にbackground-imageでURLを読み込み、bockground-sizeとbackground-positionを指定するだけです。
今回はスクロールしても背景画像を固定したいので、background-attachmentをfixed(固定)に設定しました。
background-sizeは他の値もあるのですが、レスポンシブ（スマホ）対応する場合、値をcoverに設定しておくと失敗しないかなと思います。（値をcontainにした場合、background-repeatも設定しておくと失敗しません）
背景画像を固定しない場合
background-image、bockground-size、background-positionの３つのプロパティで実現できます。
background-sizeは他の値もあるのですが、レスポンシブ（スマホ）対応する場合、値をcoverに設定しておくと失敗しないかなと思います。（値をcontainにした場合、background-repeatも設定しておくと失敗しません）
最後に
自分の頭の中では理解しているのですが、記事にするとなると伝わってるか不安になります。
ここまで見てくれてありがとうございました。
コメント