RES Video 예제1 - 부모요소너비의 100%만큼 차지
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
video {
width: 100%;
height: auto;
max-width:640px;
}
</style>
<video width="400" controls>
<source src="mp4 영상주소" type="video/mp4">
<source src="ogg 영상주소" type="video/ogg">
Your browser does not support HTML5 video.
</video>
결과보기
RES Video 예제2 - 영상원본크기를 최대크기로 설정
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
video {
max-width: 100%;
height: auto;
margin:0 auto;
display:block;
}
</style>
<video width="400" controls>
<source src="mp4 영상주소" type="video/mp4">
<source src="ogg 영상주소" type="video/ogg">
Your browser does not support HTML5 video.
</video>
결과보기
※ video 태그는 inline 속성의 태그임. 가운데정렬 시키려면, 핑크색 코드 추가해야 함.
