반응형
img 태그는 웹페이지에 이미지를 나오게 한다.
이미지는 로컬(컴퓨터)에 저장된 이미지 뿐 아니라 인터넷에 저장된 이미지도 호출 할 수 있다.
img 태그의 주요 속성으로는 src , alt 가 있다
(* 속성 : 속성이란 웹 페이지에 넣을 요소(element)에 관한 정보들을 브라우저에게 알려주는 방법이다 img 태그의 주요 속성이라 하면 이미지 위치와 이미지에 대한 설명이다.)
src : 이미지 위치
alt: 이미지 설명글. (이미지가 X박스로 안나올때 마우스를 갖다 대면 해당 설명이 나온다)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>이미지 태그</title>
</head>
<body>
<p>img 태그를 사용해서 로컬에 저장된 이미지 와 웹 이미지 를 보여줍니다.</p>
<img src="images/icon.png" alt="local image"><br>
<img src="https://tistory1.daumcdn.net/tistory/2532303/skinSetting/c8c6c4c1046c4a329087515c0087c343"
alt="web image">
</body>
</html>
위코드를 실행하면, 브라우저에 하기와 같이 나온다.
로컬(컴퓨터)에 저장된 이미지와 온라인(인터넷)에 저장된 이미지가 잘 나온다.
p, br, img 태그 만 사용하더라도 간단한 웹 페이지는 만들 수 있다.
반응형
'앱 만들기 > HTML5 study' 카테고리의 다른 글
10강. 하이퍼링크 만들기 (2) | 2024.07.03 |
---|---|
6강. div 태그 사용방법 (0) | 2024.06.26 |
4강. br 태그 사용법 (2) | 2024.06.21 |
3강. P 태그 사용법 (1) | 2024.06.20 |
2강. HTML 태그란 무엇일까? (2) | 2024.06.17 |
댓글