배경 비디오가 너무 큰

스크린 샷은 백그라운드에서 동영상입니다.
배경 비디오가 너무 큰

문제가 있습니다.
웹 사이트가 전체 화면에있을 때 비디오 크기가 커집니다. 나는 그것을 여백 상단으로 작게 만들려고 노력했다. 그러나 그것은 영상을 반으로 자른다. 비디오는 전체 화면과 희미한 화면에서 본래의 상태로 유지되어야합니다. 어떻게해야합니까?

<body> 

    <div id="videoContainer" class="half-black"> 
     <div class="videoWrapper"> 
      <video autoplay> 
       <source src="video/warwick.mp4" type="video/mp4"> 
      </video> 
     </div> 
    </div> 
    <div id="infoContainer" class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> 
    </div>

는

CSS :

#videoContainer{ 
    height:auto; 
    background-color:darkslateblue; 
    border-bottom:5px solid black; 
} 
#infoContainer{ 
    background-color:dodgerblue; 
    height:40%; 
} 

.videoWrapper > video { 
    width: 100%; 
    margin-top:-35%; 


} 
.videoWrapper{ 
    overflow: hidden; 
}

출처

2017-02-10 Augurkturk

당신의 용기에 비디오를 맞게 object-fit CSS 속성을 사용할 수 있습니다. 이것이 문제를 해결하는지 확인하고 사용하십시오. 또한 마진 속성이 필요 없습니다.

.videoWrapper > video { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
}

출처

2017-02-10 13:44:25 vikrantnegi007

tnx bro 도움이되었습니다. – Augurkturk

답변

관련 문제