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.11.20 wordpress そのページだけにcssを適用させる方法。
2023.09.06 contactform7 確認画面（切り替え）とサンクスページの設定方法
2023.05.22 Advanced Custom Fieldsの画像フィールドの使い方と応用方法
2023.08.18 Xサーバーでマルウェアに感染したら！復元リカバリー方法！
2020.05.07 wordpress PC用のページをそのままスマホで表示する方法（非レスポンシブ）
2018.11.09 サクラサーバーで無料ＳＳＬを利用する方法