divの半分だけの背景イメージ（パターン）

Question

パターン化された背景イメージ（150 x 150）が繰り返されています。私はdivコンテナーの半分にしか広がりません。出来ますか？それをどうやって行うのだろうか？

私のHTMLは、これまでのところ、それを確認しながら、あなたの#hero要素に::before擬似要素を作成し、絶対にそれを置くことができ

<section id="hero> 
    <div class="container"> 
    <div class="row"> 
    <div class="col-md-12 col-sm-12"> 
     <h1>title here</h1> 
     <h2>Lorem ipsum</h2> 
    </div> 
    </div> 
    </div> 
</section> 

と私（s）は、CSS

#hero { 
    height: 100vh; 
    background-image: url("../assets/pattern.png"); 
    background-repeat: repeat; 
} 

Answer 1

です幅の半分しか占めていない。

画像以外の背景部分が単色である場合は、その色に透過率からlinear-gradientを50％のマークで追加することもできます。