Home > ウェブデザイン備忘録 > CSSで横幅いっぱいに背景画像を表示する方法

CSSで横幅いっぱいに背景画像を表示する方法

18.10.27

ウェブデザイン備忘録

大きい要素に以下のcssを設定する。heightはお好みで。

#sample_wrap {
    background-attachment: fixed;
    background-color: #464646;
    background-image: url("images/contents01_back.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 460px;
    margin-top: 200px;
    min-width: 1140px;
    padding-top: 80px;
    width: 100%;
}

1

2

3

4

5

6

7

8

9

10

11

12

13

#sample_wrap {

background-attachment: fixed;

background-color: #464646;

background-image: url("images/contents01_back.jpg");

background-position: center center;

background-repeat: no-repeat;

background-size: cover;

height: 460px;

margin-top: 200px;

min-width: 1140px;

padding-top: 80px;

width: 100%;

}

お役に立てましたらadsenseクリックお願いします！

いかがでしたでしょうか？もしお役に立てましたら、お賽銭のつもりでadsenseをポチっとクリックお願いします！↓上手くいきますようにお祈りしておきます！

« ワードプレスで子テーマを設定する方法。

ワードプレスによるＳＥＯ対策 »

関連記事

2018.10.26 メインスライダーを画像が少し切れるカルーセルにする。
2018.10.27 ワードプレスで子テーマを設定する方法。
2024.06.28 SEOとパフォーマンス: 初心者Webデザイナー向けガイド
2022.09.28 サイト立ち上げ時（SSL後）、「サイトが安全でない」の鍵マークが出た時の対処
2021.05.25 Pagespeed insights高速化まとめ
2018.11.20 スクロールすると画面上部に固定されたメニューバーが出現する方法