セクションごとの背景

-3

最初のセクションの背景イメージとその下にある他のすべてのセクションの別のイメージが必要ですが、どうすればいいですか？セクションごとの背景

* { 
 
    box-sizing: border-box; 
 
} 
 

 
body { 
 
    margin: 0; 
 
} 
 

 
section { 
 
    width: 100%; 
 
    padding: 0 7%; 
 
    display: table; 
 
    margin: 0; 
 
    max-width: none; 
 
    background-color: #fff; 
 
    height: 100vh; 
 
} 
 
section:nth-of-type(2n) { 
 
\t background-color: #d3d3d3; 
 
} 
 

 
.intro { 
 
    height: 100vh; 
 
}

<body> 
 

 
<section class="intro"> 
 
    
 
</section> 
 

 
<section> 
 
    
 
</section> 
 

 
<section> 
 
    
 
</section> 
 

 
<section> 
 
    
 
</section> 
 

 
</body>

プレースホルダ画像とコード例は非常にあなたがセクションの異なるn番目の子にURLを置くことができる

出典

2017-10-25 Lizzy

異なるセクションに異なるクラスを使用し、各クラスの背景プロパティを割り当てます。 –

.intro{ 
 
    width: 250px; 
 
    height: 250px; 
 
    background-color: red; 
 
} 
 

 
section{ 
 
    width: 250px; 
 
    height: 250px; 
 
    border: 2px solid red; 
 
} 
 

 
section:nth-child(2){ 
 
    width: 250px; 
 
    height: 250px; 
 
    background: url('place url here'); 
 
} 
 

 
section:nth-child(3){ 
 
    width: 250px; 
 
    height: 250px; 
 
    background: url('place url here'); 
 
}

<section class="intro"> 
 

 
</section> 
 

 
<section> 
 

 
</section> 
 

 
<section> 
 

 
</section>

をいただければ幸いです。

出典

2017-10-25 10:09:27

答えて

関連する問題