HTML Image & Multimedia tag: audio, video
2022. 4. 9. 09:33ㆍcoding tutorial/HTML
<img> : 이미지를 문서 내 삽입할 때 사용하는 태그
src | 이미지 파일 경로 |
alt | 이미지 파일이 없을 경우 표시되는 문장 |
width | 이미지의 너비 (CSS에서 지정하는 것이 일반적) |
height | 이미지의 높이 (CSS에서 지정하는 것이 일반적) |
<audio> : 오디오를 문서 내 삽입할 때 사용하는 태그
src | 음악 파일 경로 |
preload | 재생 전에 음악 파일을 모두 불러올 것인지 지정 |
autoplay | 음악 파일을 자동의 재생 개시할 것인지 지정 |
loop | 음악을 반복할 것인지 지정 |
controls | 음악 재생 도구를 표시할 것인지 지정. 재생 도구의 외관은 브라우저마다 차이가 있다. |
<video> : 비디오를 문서 내 삽입할 때 사용하는 태그
src | 동영상 파일 경로 |
poster | 동영상 준비 중에 표시될 이미지 파일 경로 |
preload | 재생 전에 동영상 파일을 모두 불러올 것인지 지정 |
autoplay | 동영상 파일을 자동의 재생 개시할 것인지 지정 |
loop | 동영상을 반복할 것인지 지정 |
controls | 동영상 재생 도구를 표시할 것인지 지정. 재생 도구의 외관은 브라우저마다 차이가 있다. |
width | 동영상의 너비를 지정 |
height | 동영상의 높이를 지정 |
<!-- media tag -->
<!-- 필수 속성:src(경로지정) alt:정보를 알려주는 것 height/width:높이/너비-->
<img src="logo.png" alt="logo" height="70" width="50" />
<!-- controls:음악 컨트롤러 / autoplay:자동재생 / loop:반복재생 -->
<audio src="sound.mp3" controls autoplay loop />
<video src="video.mp4" controls autoplay loop />
'coding tutorial > HTML' 카테고리의 다른 글
HTML의 기본 태그 (DTD, html, head, body tag) (0) | 2022.04.29 |
---|---|
HTML Semantic Web (0) | 2022.04.29 |
HTML의 기본 문법 (0) | 2022.04.29 |
[HTML] form tag (0) | 2022.04.09 |
HTML 텍스트 관련 태그 (0) | 2022.03.30 |