フレックスボックスセンターイメージが画面中央に表示されます

Question

フレンドボックスのブートストラップ3で遊んでいる簡単な質問がありました。画面中央にイメージが中央に表示されているようです今、その中心ではなく、画面の上部にある：

HTML：

<div class="parallaxb"> 
      <div class="homeimgbarber"> 
      <img class="img-responsive" src="img/cuts.png" style="margin: auto;"> 
       </div> 
    </div> 

CSS：.homeimgbarberは高さが適用される必要があるため、

.parallax { 
    background-image: url("../img/c.png"); 
    min-height: 1000px; 
    background-attachment: fixed; 
    background-position: center; 
    background-repeat: no-repeat; 
    background-size: cover; 
} 

.homeimgbarber { 
    display: flex; 
    justify-content: center; 
    align-items: center; 
} 

Answer 1

それはあります。

.parallax { 
 
    background-image: url("http://via.placeholder.com/350x150"); 
 
    height: 1000px; 
 
    background-position: center; 
 
    background-repeat: no-repeat; 
 
    background-size: cover; 
 
} 
 

 
.homeimgbarber { 
 
    display: flex; 
 
    justify-content: center; 
 
    align-items: center; 
 
    height: 100vh; 
 
}

<div class="parallaxb"> 
 
      <div class="homeimgbarber"> 
 
      <img class="img-responsive" src="http://via.placeholder.com/350x150"> 
 
       </div> 
 
    </div>