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%;

}

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

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

関連記事

2019.04.05 マウスオーバーした時に画像がふわっと大きくなる方法
2023.09.06 Jqueryの基本
2023.10.12 Dreamweaver CS4 LIBCURL.dllが見つからないという、エラーメッセージが出て起動しない問題を解決
2018.10.26 メインスライダーを画像が少し切れるカルーセルにする。
2020.05.06 wordpress css更新時に自動でキャッシュをリロードする方法
2018.10.27 ワードプレスによるＳＥＯ対策