728x90
반응형
[HTML] 3. 이미지 출력하기
(1)<img>태그: 이미지를 출력할 때 필요한 태그. (<img src=”” alt=””>)
(2) src 속성: “어떤 이미지를 출력할 것인가”를 정하는 속성. 이미지의 위치(폴더), 제목을 입력한다.
(3) alt 속성: 이미지가 지정된 위치에 존재하지 않거나 출력할 수 없을 때, 이미지 대신 출력될 글을 입력하는 속성. (alt=”~”)
(좌) 아래의 코드로 출력된 이미지. (우) 이미지 파일이 출력되지 않은 화면.
이 때 이미지 대신 alt로 설정해둔 문구가 표시된다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!--img 태그와 src, alt 속성을 사용해 이미지를 출력한다.-->
<!--src 속성으로는 "어떤 이미지를 출력할 것인가"-->
<!--alt 속성으로는 웹 브라우저에서 제대로 된 이미지를 출력하지 못했을 때,
대신 출력될 문장을 지정한다.-->
<h2>맛있는 청송 사과가 한 알에 천 원!</h2>
<img src="ck-cm270027748-l-700x467.jpg" alt="맛있는 청송 사과">
</body>
</html>728x90
반응형
'HTML,CSS > HTML' 카테고리의 다른 글
| [HTML] 6. 폼 관련 태그 (0) | 2024.04.22 |
|---|---|
| [HTML] 5. 표(테이블) 만들기 (0) | 2024.04.15 |
| [HTML] 4. 링크 삽입하기 (0) | 2024.04.15 |
| [HTML] 2. HTML 기본 태그 (0) | 2024.04.14 |
| [HTML] 1. 기초 CS 지식 (0) | 2024.04.14 |
