<img> 태그를 설명하기 앞서, 필요한 이미지를 얻기 위해 pixabay를 이용하면 좋다.
pixabay에서 저작권 없는 이미지를 쉽게 다운받을 수 있다.
<img> 태그는 다음과 같이 사용된다.
간단하게 <img>태그에서 사용되는 속성 몇가지에 대해서 알아보자.
<html>
<body>
<img src="풍차사진.jpg" alt="풍차 이미지" title="풍차 이미지">
</body>
</html>
alt : 이미지가 나타나지 않을 때, "풍차 이미지"라는 text로 대체한다.
title : 이미지 위에 마우스 커서를 가져다 놓으면, "풍차 이미지"라는 text가 나타난다.
<html>
<body>
<img src="풍차사진.jpg" height="300" width="300" alt="풍차 이미지" title="풍차 이미지">
</body>
</html>
height : 이미지의 높이를 설정한다.
width : 이미지의 너비를 설정한다.
만일 height 혹은 width중 하나만 선택해서 사용한다면, 나머지 부분은 원래 이미지 비율에 맞춰서 자동적으로 크기가 조절된다.
'HTML' 카테고리의 다른 글
| <form> 태그 (0) | 2020.01.31 |
|---|---|
| <table> 태그 (0) | 2020.01.31 |
| <p>, <br> 태그 (0) | 2020.01.30 |
| Html의 문서 구조 (0) | 2020.01.30 |
| <ul>, <ol>, <li> 태그 활용법 (0) | 2020.01.30 |