<img>
<img src="이미지주소" alt="대체문자열">
- src 속성 : 이미지가 저장된 주소의 URL 주소
- alt 속성 : 이미지가 로딩될 수 없는 상황에서 이미지 대신 나타날 문자열을 설정
src 속성
<img src="이미지주소" alt="대체문자열">
- 이미지가 저장된 주소의 URL 주소를 명시
- 이미지 파일이 src 속성에서 지정한 경로에 없을시, 이미지는 출력되지 않거나 엑스박스
- 이미지가 로딩될 수 없는 상황에서 이미지 대신 나타날 문자열을 설정 가능
이미지 크기
<img src="my_profile.png" width="500" height="300">
- width 속성 : 이미지 가로 크기
- height 속성 : 이미지 세로 크기
이미지 테두리
<img src="/examples/images/img_flag.png" alt="이미지 테두리"
style="width:320px; height:214px; border: 3px solid black">
- border 속성
이미지 링크
<a></a>
<a href="/html/intro" target="_blank">
<img src="/examples/images/img_flag.png" alt="flag" style="width:320px; height:214px">
</a>
이미지 맵
이미지의 일부를 클릭할 수 있도록 만들어서 버튼처럼 사용하는 기능
<img src="/examples/images/img_imagemap.jpg" alt="진실혹은거짓" usemap="#vending" style="width:320px; height:240px" />
<map name="vending">
<area shape="rect" coords="90,60,180,130" alt="거짓"
href="https://ko.wikipedia.org/wiki/%EA%B1%B0%EC%A7%93%EB%A7%90">
<area shape="rect" coords="210,200,70,130" alt="진실"
href="https://ko.wikipedia.org/wiki/%EC%A7%84%EC%8B%A4">
</map>
- <img>태그 usemap 속성과 <map>태그의 name 속성과 연결 -> 이미지와 맵사이의 관계가 설정
- <map>태그는 하나 이상의 <area>태그를 가짐
- <area>태그 : 버튼과 같은 역할
이미지 배경
<body background></body>
HTML 요소의 배경을 이미지(image)로 설정
배경으로 이미지를 사용하면 웹 페이지의 로딩시간이 증가
보통은 작은 사이즈의 이미지를 패턴(pattern)으로 만들어 배경 이미지로 반복 설정
<태그이름 background="이미지주소">