반응형
학원 프론트엔드 수업 숙제 ! ༼ つ ◕_◕ ༽つ
<인터넷 기사를 선택하여 이미지 및 서식태그를 이용하여 페이지를 만들기>
아직 배운지 얼마 안돼서 복붙복붙... 엉성하지만 열심히 만들었습니당
[뉴스 메인 - 기사 목록]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>인터넷 기사</title>
</head>
<body>
<h2>인터넷 기사📰</h2>
<table border="1" width = "600">
<tr>
<td>
<p>
<img src="./logo.png" alt="로고" width="20">인사이트 1일전
<img src="./메인.jpg" align = "right" width="260">
</p>
<p>
<a href="./news1info.html">
<strong>카카오 프렌즈 새 멤버 후보 '여우·고슴도치·햄스터' 대국민 투표 상..</strong>
</a>
<br>지난 15일 라이언과 춘식이는 은행나무 옆 서점 지킴이 '홍이'에게 한 통의 편지를 받았다.
<br>편지에는 오는 4월 23일 '세계 책의 날'을 맞이해 진행하는 이벤트에 라이언..</p>
<td>
</tr>
</table>
<table border="1" width = "600">
<tr>
<td>
<p>
<img src="./logo2.jpg" alt="로고2" width="20">
조선비즈 2020.12.17<img src="./newsmain.png" align = "right" width="260">
</p>
<p>
<a href="./news2info.html">
<strong>카카오 프렌즈, 라이언의 반려묘 '춘식이' 굿즈 첫 출시</strong>
</a>
<br>라이언의 반려묘, 길고양이 ‘춘식이’가 굿즈로 출시됐다.
카카오커머스는 카카오프렌즈의 새 캐릭터 ‘춘식이’를 선보인다고 17일 밝혔다.
춘식이는 라이언이 길에서...</p>
<td>
</tr>
</table>
</body>
</html>
[뉴스1 상세페이지]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>카카오프렌즈</title>
</head>
<body>
<h2 align = "center">카카오 프렌즈 새 멤버 후보 '여우 • 고슴도치 • 햄스터' 대국민 투표 상황</h2>
<p>라이언 기자 • Lion @ kakao.com
<img src="./facaebook.png" alt="페북" width="20" align = "right">
<img src="./twiter.png" alt="트위터" width="20" align = "right">
<img src="./kakao.png" alt="카톡" width="20" align = "right"></p>
<hr/>
<img src="./news1.JPG" alt="뉴스1" width = 500 >
<img src="./AD1.JPG" alt="광고" align = "right">
<p>[인사이트] 성동권 기자 = <b>"서점에서 기다리고 있는 홍이가 누굴까?"</b></p>
<p>많은 이들의 사랑을 받는 카카오 프렌즈 캐릭터 대열에 뉴 페이스가 합류할 전망이다.</p>
<p>지난 15일 라이언과 춘식이는 은행나무 옆 서점 지킴이 '홍이'에게 한통의 편지를 받았다.</p>
<p>편지에는 오는 4월 23일 '세계 책의 날'을 맞이해 진행하는 이벤트에 라이언과 춘식이를 초대한다는 내용이 담겨 있었다.</p>
<img src="./news2.JPG" alt="뉴스2" width = 500><br>
<img src="./news3.JPG" alt="뉴스3" width = 500>
<p>여기서 서점 지킴이 홍이는 3명의 인물 중 한 명인데 그 후보는 다음과 같다.</p>
<p><b>통통한 햄스터, 털이 몽글몽글한 고슴도치, 섬세한 성격의 여우.</b></p>
<p>궁금중을 유발하는 홍이의 정체를 두고 현재 카카오에서는 대국민 투표가 이뤄지고 있다.<br>여기서 1등으로 선정된 캐릭터는 올 가을 카카오 프렌즈를 통해 공개될 예정이다.</p>
<p>치명적인 귀여움을 자랑하는 후보들의 등장에 누리꾼들은 열띤 환호를 보내며 투표에 참여하고 있다.</p>
<img src="./news4.JPG" alt="뉴스4" width= 500>
<p>이날 오전 10시 기준 97000명이 투표에 참여한 가운데 여우가 46%를 차지하며 1위를 달리고 있다.<br>고슴도치는 30%, 햄스터는 24%로 뒤를 이었다.</p>
<p>투표는 오늘(16일) 23시 59분까지 가능하고 1일 1회 투표할 수 있다.</p>
<p>아직 투표 시간이 많이 남은 만큼 최후의 승자가 누가 될지 누리꾼들의 관심이 집중된다.</p>
<p>[저작권자 © 인사이트, 무단전재 및 재배포 금지]</p>
</body>
</html>
[뉴스2 상세페이지]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>카카오프렌즈</title>
</head>
<body>
<h2>카카오프렌즈, 라이언의 반려묘 ‘춘식이’ 굿즈 첫 출시</h2>
<p>라이언 기자 • Lion @ kakao.com
<img src="./facaebook.png" alt="페북" width="20" align = "right">
<img src="./twiter.png" alt="트위터" width="20" align = "right">
<img src="./kakao.png" alt="카톡" width="20" align = "right"></p>
<hr/>
<img src="./newsmain.png" alt="뉴스2" width = 500 >
<img src="./AD1.JPG" alt="광고" align = "right">
<p>라이언의 반려묘, 길고양이 ‘춘식이’가 굿즈로 출시됐다.</p>
<p>카카오커머스는 카카오프렌즈의 새 캐릭터 ‘춘식이’를 선보인다고 17일 밝혔다.</p>
<p>춘식이는 라이언이 길에서 데려와 룸메이트가 된 고양이로, 올해 7월 라이언 인스타그램에 처음 등장했다.<br> 느긋하고 독립적인 고양이의 특성을 지닌 캐릭터로, 라이언과는 서로 돌봐주고 위로가 되어주는 친구 관계라는 설명이다.</p>
<p>춘식이 굿즈는 총 3종으로, 베이비필로우/마우스패드/스티커 세트로 구성됐다.</p>
<p>
춘식이 베이비필로우는 앙증맞고 귀여운 춘식이의 매력을 살렸으며,<br> 세로로 세우거나 가로로 눕혔을 때 모두 연출이 가능한 부드러운 소재의 인형이다.</p>
<p>마우스패드는 고양이지만 사료보다 고구마를 더 좋아하는 춘식이의 특징을 반영해 실용적인 아이템으로 선보이는 제품이며,<br> 스티커세트는 다양한 춘식이의 매력을 느낄 수 있도록 제작됐다.</p>
<p>오는 17일 오전 9시부터 카카오프렌즈 온라인 스토어와 18일 카카오톡 선물하기에서 선판매하며,<br> 오프라인 매장은 19일부터 카카오프렌즈 강남/홍대 플래그십 스토어를 시작으로 순차적으로 다른 카카오프렌즈 매장에서도 만나볼 수 있다.
</p>
</body>
</html>
[결과]
뉴스 출처 : 인사이트 https://www.insight.co.kr/
조선비즈 https://biz.chosun.com/
반응형
'프로그래밍 > HTML' 카테고리의 다른 글
| 12 폼 <form>과 method 속성 (0) | 2021.04.18 |
|---|---|
| 11 아이프레임 <iframe> (0) | 2021.04.18 |
| 09 <a> 하이퍼링크와 bookmark (0) | 2021.04.17 |
| 08 <table> 테이블 태그 (0) | 2021.04.17 |
댓글