ページごとの背景を変えるCSS（WordPress）

2022-10-11

背景色をつける

#content{
    background:#000;
}

背景画像を指定する

#contents{
    background:url(https://サイトのURL/wp-content/uploads/2021/02/sample_bg.jpg) center no-repeat;
    background-size:cover;
}

ページごとに変える

検証ツールでid番号を調べる

投稿ページであれば「postid-」

固定ページであれば「pageid-」

例

.postid-150{
    background:url(https://サイトのURL/wp-content/uploads/2021/02/sample_bg.jpg) center no-repeat;
    background-size:cover;
}

背景を固定させる

背景画像を設定しているセレクタに　background-attachment:fixed　を追記すればOK

.fixed-inner{
  width:100%;
  height:auto;
  background:（url背景画像) bottom no-repeat;
  background-size:cover;
}
#fixed-sample .fixed-inner{
  background-attachment:fixed;
}