모르는개 HIML
HTML 오디오&비디오 넣는법
스트라컴
2021. 2. 18. 16:13
예제 파일
안녕하세요 산책입니다. 오늘은 HTML에서 오디오와 비디오를 넣어보도록 하겠습니다.
atom을 실행시켜 주시고요
html file을 만들어주세요.
1. 오디오 AUDIO
<body>
<audio controls>
<source src="1.mp3" type="audio/mpeg">
</audio>
</body>
이렇게 넣어주시면 됩니다. 아주 쉽죠??
<audio> 태그의 속성에 대해 알아보겠습니다.
속성 | 설명 |
src | 오디오 파일명(경로 포함) 설정 |
controls | 화면에 플레이어 표시하기 |
autoplay | 자동 재생 ※크롬에서는 오디오의 자동 재생을 허용하지 않음 |
loop | 무한 반복 |
2. 비디오 VIDEO
<body>
<video width="320" height="240" controls> <- 넓이와, 높이를 설정해주고 화면 표시까지 해주었어요
<source src="2.mp4" type="video/mp4">
</video>
</body>
이렇게 넣어주시면 됩니다. 아주 쉽죠??
<video> 태그의 속성에 대해 알아보겠습니다.
속성 | 설명 |
src | 비디오 파일명(경로 포함) 설정 |
width | 비디오 영상의 너비 |
height | 비디오 영상의 높이 |
controls | 화면의 플레이어 표시하기 |
autoplay | 자동 재생 ※크롬에서는 오디오의 자동 재생을 허용하지 않음 |
loop | 무한반복 |
오늘은
오디오, 비디오 넣는 방법에 대해 알아보았습니다.
별로 난이도가 높지 않아서 그대로 복사 붙여 넣기 해주시면 될 거 같아요