2017-08-31 40 views
1

不透明度を0.2に設定した背景画像を追加したいと思います。私のサイトの本体に私はすでにヘッダーに1つの背景イメージを持っていますが、ヘッダーとフッターの間に本文に1つ追加すると、ページの下にコンテンツがプッシュされ、メイン本文のコンテンツはフッターエリアにプッシュされます。ヘッダ背景画像の下の背景に画像を追加することは可能ですか?

私はここにいるので、どんな助けも素晴らしいでしょう。私は必要に応じてここに私のコードを掲載しています。

これは私が持っているコード

.background-img { 
    background-image: url(img/background-scott.png); 
    background-size: cover; 
    background-position: left; 
    opacity: .2; 
    background-repeat: no-repeat; 
    height: 100vh; 
    margin: 0; 
    padding: 0; 
} 

上記のクラスは、コードのセクション全体を概説メインDIVに設定した。でありますセクションタグは、同じ効果を持つ...

は、あなたが身体たり、ヘッダーの親である任意の容器にその背景画像を追加することができます

+0

あなたのhtmlを投稿? –

+0

私は現時点でサイトをライブで投稿できますが、ここに投稿するにはあまりにも多くのコード行があります。 –

+0

私は現時点で私のサイトを掲載しています。 URLはhttp://www.dsjw71sitedesign.comです。私は、テンプレートセクションの右側に背景イメージを入れたいと思っています。ヘッダーの下とフッターの上に... –

答えて

0

ありがとうございます。

body { 
 
    background-image: url(http://via.placeholder.com/800x400); 
 
    background-size: cover; 
 
    background-position: left; 
 
    opacity: .2; 
 
    background-repeat: no-repeat; 
 
    height: 100vh; 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 

 
header { 
 
    background-image: url(http://lorempixel.com/400/200/); 
 
    background-size: cover; 
 
    height: 30vh; 
 
    width: 100vw; 
 
}
<body> 
 

 
<header></header> 
 

 
</body>