이미지 표현 방법

HTML로 이미지 표현하는 방법

HTML문서에 이미지를 삽입하기 위해서는 <img>태그를 사용합니다.

기본 문법

<img src="이미지 경로">

<img>태그의 가장 기본적인 속성은 이미지 경로를 지정하는 src 속성입니다.

이미지의 너비와 높이를 지정하기 위해서는 width 속성과 height 속성을 사용합니다. 이 속성을 지정해주지 않으면 기본적으로 이미지 자체의 너비와 높이로 삽입됩니다.

<img src="이미지 경로"width="100" height="200">

이미지에 링크를 거는 경우 링크가 걸린 이미지라는 것을 표시해주기 위해서는 기본적으로 이미지의 경계선이 1px로 표시됩니다. 그래서 이 경계선을 없앨려면 border속성을 0으로 지정해 줍니다.

<a href="url"><img src="이미지 경로"border="0"></a>

이미지 경로 - 절대경로와 상대경로

이미지의 경로를 지정하는 방법은 절대경로와 상대경로가 있습니다. 절대경로와 상대경로는 이미지 삽입뿐 아니라 링크를 걸때도 똑같이 적용되는 부분이므로 아주 중요합니다.

• 1. 절대 경로
• 2. 상대경로

이미지 포멧 - 홈페이지에서 사용하는 이미지의 종류

홈페이지에서 사용하는 이미지는 대표적으로 jpg, gifm png 파일이 있습니다.

• 1. GIF
• 2. JPG
• 3. PNG

이미지 정렬(align)

• 1. 기본 정렬
• 2. align
• 3. left와 right