어떻게 CSS를 사용하여 비디오를 센터링합니까

Question

내 사이트에 비디오를 센터링하려하지만 다소 쓸모가 없어 HTML에서 센터 태그를 사용하고 싶지 않습니다. CSS로 어떻게 할 수 있습니까? 도움이된다면 여기에 내 HTML 코드가 있습니다.

<center> 
    <video width="320" height="240" controls> 
    <source src="video.mp4" type="video/mp4"> 
    <source src="video.ogg" type="video/ogg"> 
    <source src="video.webm" type="video/webm"> 
    Your browser does not support the video tag. 
    </video> 
</center> 

Answer 1

다음은 예입니다 :

http://jsfiddle.net/Cn7SU/ 그냥 요소 video 이러한 CSS 규칙을 추가 :

display: block; 
margin: 0 auto; 

는 display: block 속성이 매우 중요합니다 추가합니다. 그렇지 않으면 요소를 가운데로 맞출 수 없습니다.

Answer 2

동영상 태그 주위에 래퍼 div가 있습니다. html5 비디오 및 이미지는 스타일링 할 때 텍스트처럼 취급됩니다. 따라서 텍스트 정렬 : 센터가 작동합니다. 아래 바이올린을 확인할 수 있습니다. 센터 비디오

<div class="video"> 
    <video width="320" height="240" controls> 
    <source src="video.mp4" type="video/mp4"> 
    <source src="video.ogg" type="video/ogg"> 
    <source src="video.webm" type="video/webm"> 
    Your browser does not support the video tag. 
    </video> 
</div> 

Answer 3

수평 추가 : 오래된의

display: block; 
margin: 0 auto;