반응형
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>유재석_나무위키</title>
<style>
ol{list-style:none}/*ol의 불릿을 모두 없앰*/
a{text-decoration:none}/*링크의 밑줄(underline)을 모두 없앰*/
a:hover{text-decoration:underline}/*hover(마우스에 올렸을 때 라는 뜻)로 a태그에 마우스 올리면 밑줄이 보이는 스타일 적용*/
caption,th{background:gray;color:white}/*선택자를 ,(쉼표)로 그룹핑할 수 있다*/
</style>
</head><!--브라우저는 위에서 아래로, 왼쪽에서 오른쪽 순서로 읽는다-->
<body>
<!-- 목차 : ctrl+/ 누르면 주석 쓸 수 있게 나옵니다. -->
<!-- ctrl+alt+방향키 : 함께 선택, Home과 end 키로 행의 앞 뒤 조정이 쉽게 가능 -->
<h2>목차</h2>
<ol>
<!-- 책갈피 기능 = 한 페이지 안에서 앵커로 이동하는 것 id와 a 태그를 활용해서 씀 -->
<li><a href="#sub1">1.</a>개요</li>
<li><a href="#">2.</a>인기와 위상</li>
<li><a href="#">3.</a>방송 활동
<ol>
<li><a href="#">3.1</a>.<a href="https://namu.wiki/w/%EC%9C%A0%EC%9E%AC%EC%84%9D/%ED%99%9C%EB%8F%99%20%EB%82%B4%EC%97%AD" title="유재석 활동내역">활동 내역</a></li>
<li><a href="#">3.2</a>.방송 경력</li>
<li><a href="#">3.3</a>.<a href="https://namu.wiki/w/DY%20%EC%97%94%ED%84%B0%ED%85%8C%EC%9D%B8%EB%A8%BC%ED%8A%B8%20%EC%82%AC%EA%B1%B4">DY 엔터테인먼트</a></li>
<li><a href="#">3.4</a>.<a href="https://namu.wiki/w/%EC%9C%A0%EC%9E%AC%EC%84%9D/%EC%88%98%EC%83%81%20%EB%82%B4%EC%97%AD">수상 내역</a></li>
<li><a href="#">3.5</a>.<a href="https://namu.wiki/w/%EC%9C%A0%EC%9E%AC%EC%84%9D/%ED%8A%B9%EC%A7%95">특징</a></li>
<li><a href="#">3.6</a>.<a href="https://namu.wiki/w/%EC%9C%A0%EC%9E%AC%EC%84%9D/%EC%9D%8C%EC%95%85%20%ED%99%9C%EB%8F%99">음악활동</a></li>
</ol>
</li>
<li><a href="#">4.</a>인품과 우상
<ol>
<li><a href="#">4.1</a>.기부</li>
<li><a href="#">4.2</a>.동료들과의 에피소드</li>
<li><a href="#">4.3</a>.기타 에피소드</li>
</ol>
</li>
<li><a href="#">5.</a><a href="https://namu.wiki/w/%EC%9C%A0%EC%9E%AC%EC%84%9D/%EB%8C%80%EC%9D%B8%20%EA%B4%80%EA%B3%84">대인 관계</a></li>
<li><a href="#">6.</a><a href="https://namu.wiki/w/%EB%AC%B4%ED%95%9C%EC%9E%AC%EC%84%9D%EA%B5%90">팬덤</a>
<ol>
<li><a href="#">6.1</a>.광팬</li>
<li><a href="#">6.2</a>.안티</li>
</ol>
</li>
<li><a href="#">7.</a>거짓 루머
<ol>
<li><a href="#">7.1</a>.<a href="https://namu.wiki/w/%ED%94%84%EB%A1%9C%ED%8F%AC%ED%8F%B4">프로포폴</a> 사건 연루 루머</li>
<li><a href="#">7.2</a>.<a href="https://namu.wiki/w/%EC%8B%A0%EC%B2%9C%EC%A7%80%EC%98%88%EC%88%98%EA%B5%90%20%EC%A6%9D%EA%B1%B0%EC%9E%A5%EB%A7%89%EC%84%B1%EC%A0%84?from=%EC%8B%A0%EC%B2%9C%EC%A7%80">신천지</a> 연관 루머</li>
</ol>
</li>
<li><a href="#">8.</a><a href="https://namu.wiki/w/%EC%9C%A0%EC%9E%AC%EC%84%9D/%EC%96%B4%EB%A1%9D">어록</a></li>
<li><a href="#">9.</a><a href="https://namu.wiki/w/%EC%9C%A0%EC%9E%AC%EC%84%9D/%EB%B9%84%ED%8C%90">비판</a></li>
<li><a href="#">10.</a><a href="https://namu.wiki/w/%EC%9C%A0%EC%9E%AC%EC%84%9D/%EC%97%AC%EB%8B%B4">여담</a></li>
</ol>
<!-- 프로필 표 -->
<table border="1" cellspacing="0">
<caption><b>유재석<br>劉在錫 ｜ Yu Jae-seok</b></caption>
<tr><!--병합을 하기 전에 스타일을 만들어 놓아라!-->
<td colspan="2"><img src="./img/yjs.png" width="750px" height="1126px"></td>
</tr>
<tr>
<th rowspan="2">출생</th>
<td><a href="#">1972년</a> <a href="#">8월 14일</a>(49세)</td>
</tr>
<tr>
<td><a href="#">서울특별시</a> <a href="#">성북구</a> <a href="#">수유동</a>
<br><!--윗첨자 문자 넣기 : sup / 아랫첨자 문자 넣기 : sub-->
(現 <a href="#">서울특별시</a> <a href="#">강북구</a> <a href="#">수유동</a>)<sup>[8]</sup></td>
</tr>
<tr>
<th>거주지</th>
<td><a href="#">서울특별시 강남구 압구정동</a></td>
</tr>
<tr>
<th>국적</th>
<td><img src="./img/icon.svg" width="20px" height="15px"><a href="#">대한민국</a></td>
</tr>
<tr>
<th>본관</th>
<td><a href="#">강릉 유씨</a></td>
</tr>
</table>
<!-- 고유의 이름을 설정 해주려는 것이 id 속성 입니다. id는 영소문자로(숫자는 맨 앞에만 안붙으면 된다) 써야함. 한글, 특수문자 안됨! -->
<!-- id 속성은 html의 모든 태그에 사용할 수 있다. id는 고유의 이름이므로 똑같은 이름이 중복되면 안된다. -->
<h2 id="sub1">1. 개요</h2>
<fieldset>
<p>이 문단은 아래 토론들로 합의된 편집방침이 적용됩니다. 합의된 부분을 토론 없이 수정할 시 제재될 수 있습니다.</p>
</fieldset>
<!--맥락을 따져보면 이미지가 내용 컨텐츠 안으로 들어가기 때문에 p태그 사이에 넣어줌-->
<p><img src="./img/img1.png" alt="유재석 사진"></p>
<p>코미디언 출신 MC, 방송인 겸 가수이며 대한민국의 국민MC다. 1991년 KBS 공채 개그맨 7기[28]로 데뷔했다. 대한민국 방송계 역사에 전무후무한 17회 대상 수상[29]을 기록했으며 국민MC라는 별명으로 전국민적인 인기를 누리고 있다.</p>
<hr>
<dl>
<dt>1.개요</dt>
<dd>이 문단은 아래 토론들로 합의된 편집방침이 적용됩니다. 합의된 부분을 토론 없이 수정할 시 제재될 수 있습니다.</dd>
<dd><img src="./img/img1.png" alt="유재석 사진"></dd>
<dd>코미디언 출신 MC, 방송인 겸 가수이며 대한민국의 국민MC다. 1991년 KBS 공채 개그맨 7기[28]로 데뷔했다. 대한민국 방송계 역사에 전무후무한 17회 대상 수상[29]을 기록했으며 국민MC라는 별명으로 전국민적인 인기를 누리고 있다.</dd>
</dl>
</body>
</html>반응형
'IT > HTML&CSS' 카테고리의 다른 글
| [HTML] div 영역 나누기_예제만들기(2021-09-10) (0) | 2021.11.09 |
|---|---|
| [HTML] form 양식폼 만들기(2021-09-09) (0) | 2021.11.09 |
| [HTML] 내부스타일시트방식_기초(2021-08-31) (0) | 2021.11.08 |
| [HTML] 인라인스타일_기초(2021-08-31) (0) | 2021.11.08 |
| [HTML] 표만들기(Table)_예제_기초(2021-08-27) (0) | 2021.11.08 |