이미지 관련 태그
•
<img src="삽입하고자 하는 이미지의 경로" alt="이미지 설명문구" width="가로길이(px/%)" height="세로길이(px/%)">
◦
alt
▪
사진의 경로가 잘못되거나 이미지를 제대로 표현할 수 없는 경우 대체 텍스트의 용도
▪
시각장애인들을 위한 스크린리더(화면낭독기)에서 이미지를 읽어주는 설명 문구
<img src="resources/image/city1.PNG" alt="이 사진은 도시 사진입니다.">
HTML
복사
•
width와 height 속성
◦
이미지의 가로, 세로길이 조정 가능
◦
고정길이(px), 가변길이(%)로 지정
▪
고정길이단위(px) == 기본값 : 화면사이즈가 조정이 돼도 이미지의 크기는 변동 없음
▪
가변길이단위(%) : 화면사이즈 혹은 부모요소사이즈에 따라 이미지의 크기도 같이 변동
<img src="resources/image/flower1.PNG" width="200px" height="150">
<img src="resources/image/flower1.PNG" width="15%" height="150">
HTML
복사
오디오 관련 태그
<audio src="경로" controls autoplay loop></audio>
HTML
복사
•
src : 오디오 경로
•
controls : 재생도구 출력 여부
•
autoplay : 자동 재생여부 지정 (자동재생은 크롬 미지원!!)
•
loop : 반복 재생여부 지정
비디오 관련 태그
<video src="경로" controls autoplay loop width="가로길이지정가능" height="높이지정가능" poster="썸네일"></video>
HTML
복사
