연습문제 1~3
1. quiz-1.html문서에서 '이미지 삽입하기' 제목 아래 images 폴더에 있는 umbrella.jpg 이미지를 삽입하세요. 이때 이미지 크기가 크기 때문에 실제로 화면에 표시할 때는 320 x 210 크기로 줄여 사용하세요.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>이미지 삽입하기</title>
</head>
<body>
<h1>이미지 삽입하기</h1>
<img src="images/umbrella.jpg" width="320" height="210" alt="umbrella">
</body>
</html>
2. quiz-2.html 문서의 '국내 포털 사이트 Daum으로 연결하기'라는 제목 아래에 'Daum'로고 이미지를 삽입하세요. 이미지 파일은 따로 제공하지 않으므로 Daum 사이트에서 로고 이미지 경로를 복사해 사용합니다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>링크 사용하기</title>
</head>
<body>
<h1>포털 사이트 Daum으로 연결하기</h1>
<img src="https://t1.daumcdn.net/daumtop_chanel/op/20200723055344399.png" width="180" height="94" id="daum" class="img_thumb" alt="Daum">
</body>
</html>
3. quiz-3.html의 다음 로고 이미지를 클릭했을 때 다음 사이트(http://www.daum.net)로 연결되도록 링크를 추가하세요. 다만 링크된 사이트는 새 창이나 새 탭에서 열리도록 합니다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>링크 사용하기</title>
</head>
<body>
<h1>포털 사이트 Daum으로 연결하기</h1>
<a href="https://www.daum.net/">
<img src="http://icon.daumcdn.net/w/icon/1606/08/150737977.png" alt="Daum">
</a>
</body>
</html>
'HTML > 이미지와 하이퍼링크' 카테고리의 다른 글
| 이미지와 하이퍼링크 (0) | 2021.08.05 |
|---|