학습내용
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>네이버 TV연예</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<!-- 네이버 뉴스 TV연예 -->
<!-- TV연예 상단 -->
<header id="ent-header">
<div class="ent-flex-between">
<div class="ent-header-left">
<ul class="ent-flex-start">
<li><a href="#">TV연에</a></li>
<li><a href="news.html">뉴스</a></li>
<li><a href="#">TOKYO 2020</a></li>
</ul>
</div>
<div class="ent-header-center">
<ul class="ent-flex-center">
<li class="on"><a href="#">TV연예홈</a></li>
<li><a href="#">TV</a></li>
<li><a href="#">포토</a></li>
<li><a href="#">랭킹</a></li>
<li><a href="#">영화</a></li>
<li><a href="#">최신뉴스</a></li>
</ul>
</div>
<div class="ent-header-right ent-flex-end">
<a href="#" class="btn-login">로그인</a>
<button type="button" class="btn-menu"></button>
<button type="button" class="btn-search"></button>
</div>
</div>
</header>
<!-- TV연예 메인 -->
<main role="main" id="ent-main">
<div class="ent-container">
<div class="ent-left">
<div id="ent-media-headline">
<ul class="ent-flex-between">
<li>
<a href="#">
<div class="media-top">
<img src="https://via.placeholder.com/148x145">
<span class="time">03:04</span>
<i class="icon-play"></i>
</div>
<div class="media-bottom">
<p>[tvN 악마판사]"너 원래 하녀...</p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="media-top">
<img src="https://via.placeholder.com/148x145">
<span class="time">03:04</span>
<i class="icon-play"></i>
</div>
<div class="media-bottom">
<p>[tvN 악마판사]"너 원래 하녀...</p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="media-top">
<img src="https://via.placeholder.com/148x145">
<span class="time">03:04</span>
<i class="icon-play"></i>
</div>
<div class="media-bottom">
<p>[tvN 악마판사]"너 원래 하녀...</p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="media-top">
<img src="https://via.placeholder.com/148x145">
<span class="time">03:04</span>
<i class="icon-play"></i>
</div>
<div class="media-bottom">
<p>[tvN 악마판사]"너 원래 하녀...</p>
</div>
</a>
</li>
</ul>
</div>
<div id="ent-section-1">
<ul>
<li>
<a href="#" class="ent-flex-between">
<img src="https://via.placeholder.com/148x90">
<div class="ent-news-wrap">
<h3>Title 1</h3>
<p>배우 신현빈이 '재벌집 막내아들' 출연을 확정 지었다. JTBC 새 드라마 '재벌집 막내아들'(김태희 극본,
정대윤 연출)은 동명의 웹 소설을 원작으로, 재벌 총수 일가의 오너리스크…</p>
<div class="bottom-wrap ent-flex-between">
<span class="source">스포츠조선</span>
<span class="count">17</span>
</div>
</div>
</a>
</li>
<li>
<a href="#" class="ent-flex-between">
<img src="https://via.placeholder.com/148x90">
<div class="ent-news-wrap">
<h3>Title 2</h3>
<p>가수 전소미의 신곡이 드디어 베일을 벗는다. 전소미는 2일 오후 6시 각종 온라인 음원사이트를 통해
신곡 '덤덤(DUMB DUMB)'을 발매한다. '덤덤(DUMB DUMB)'은 미니…</p>
<div class="bottom-wrap ent-flex-between">
<span class="source">스포츠조선</span>
<span class="count">17</span>
</div>
</div>
</a>
</li>
</ul>
</div>
<div id="ent-section-2">
<ul class="ent-flex-between">
<li>
<a href="#">
<img src="https://via.placeholder.com/200x122">
<h3>Long Title 1 Long Title 1 Long Title 1 Long Title 1</h3>
<div class="ent-bottom ent-flex-between">
<span class="source">스타뉴스</span>
<span class="count">13</span>
</div>
</a>
</li>
<li>
<a href="#">
<img src="https://via.placeholder.com/200x122">
<h3>Long Title 2 Long Title 2 Long Title 2 Long Title 2</h3>
<div class="ent-bottom ent-flex-between">
<span class="source">스타뉴스</span>
<span class="count">13</span>
</div>
</a>
</li>
<li>
<a href="#">
<img src="https://via.placeholder.com/200x122">
<h3>Long Title 3 Long Title 3 Long Title 3 Long Title 3</h3>
<div class="ent-bottom ent-flex-between">
<span class="source">스타뉴스</span>
<span class="count">13</span>
</div>
</a>
</li>
</ul>
</div>
<div id="ent-section-3">
<div class="title-wrap ent-flex-between">
<h3>스타 콘텐츠</h3>
<div class="right-wrap ent-flex-end">
<div class="count-wrap">
<span><em>1</em> / 2</span>
</div>
<div class="btn-wrap ent-flex-end">
<button type="button" class="btn btn-prev"></button>
<button type="button" class="btn btn-next"></button>
</div>
</div>
</div>
<ul class="ent-flex-between">
<li>
<a href="#">
<img src="https://via.placeholder.com/148x148">
<span>ACE FACTORY</span>
<h3>소속사가 자랑하는 연기 천재</h3>
</a>
</li>
<li>
<a href="#">
<img src="https://via.placeholder.com/148x148">
<span>ACE FACTORY</span>
<h3>소속사가 자랑하는 연기 천재</h3>
</a>
</li>
<li>
<a href="#">
<img src="https://via.placeholder.com/148x148">
<span>ACE FACTORY</span>
<h3>소속사가 자랑하는 연기 천재</h3>
</a>
</li>
<li>
<a href="#">
<img src="https://via.placeholder.com/148x148">
<span>ACE FACTORY</span>
<h3>소속사가 자랑하는 연기 천재</h3>
</a>
</li>
</ul>
</div>
</div>
<div class="ent-right">
</div>
</div>
</main>
</body>
</html>학습소감
중간의 몇몇의 오탈자 외엔 큰 어려움 없이 수월하게 결과값을 도출할 수 있었다.
AI School for Daegu