-
[ 코딩 19 ] html 비디오 태그 알아보기코딩의 즐거움/HTML 2020. 11. 4. 17:56
[ 코딩 19 ] html 비디오 태그 알아보기
<video>
<source src="경로/동영상명.mp4" type="video/mp4">
</video>
동영상을 추가하고 싶으면,
video 태그를 적어주면 된다.
src 는 비디오 파일의 주소를 적어주면 된다. 경로는 해당 폴더명을 적어주면 된다.
video 태그의 poster는 비디오를 재생하기 전의 썸네일이미지를 추가해 준다.
그외 video 태그의 속성들
<video width="값" height="값">
<source src="경로/동영상명.mp4" type="video./mp4">
</video>
width와 height 속성으로 동영상의 너비와 높이를 조절할 수 있다.
<video autoplay controls>
<source src="경로/비디오명.mp4" type="video.mp4">
<vidoe>
autoplay -> 자동 재생
controls -> 컨트롤 막대라고 해서
이미지에보면 점선으로 표시해둔 부분이 컨트롤 막대다.
재생, 음량조절, 다음 영상으로 이동 등이 컨트롤 막대에 나타난다.
<video loop>
<source src="경로/비디오명.wepm" type="video.wepm">
</video>
loop - 동영상을 반복 재생해 준다.
마무리 속성 정리
'코딩의 즐거움 > HTML' 카테고리의 다른 글
[ HTML] id(아이디) 선택자와 class(클래스) 선택자 (0) 2020.11.16 [ 코딩 20 ] html 시멘틱 태그 알아보기 (0) 2020.11.06 [ 코딩 18 ] HTML input type 종류 알아보기 (0) 2020.11.03 [코딩 17] HTML 테이블 태그 두번째 (0) 2020.10.25 [코딩 15] HTML 이미지 링크 걸기 (0) 2020.10.23