HTML

본문을 바로 보시려면 스크롤을 내리거나 접으세요. <div class="libre-notice" style="overflow: hidden; padding: 15px; margin: 15px 0px; border: 3px solid #2196F3; background-color: #E3F2FD;border-radius: 4px;"><div class="tp_link" style="font-size: 16pt; color: #2196F3;"><b>이 문서는 <a href="/wiki/%EC%95%94%EB%AC%B5%EC%9D%98_%EB%A3%B0" title="암묵의 룰" class="mw-redirect">암묵의 룰</a>로 작성되었습니다.</b></div><div style="margin-top: .5em;"> <span class="insertusername">위키러</span>님의 눈이 이상한 게 아닙니다.당황하지 말고 이 문서의 룰을 파악해 보세요.</div></div> <h2><span class="mw-headline" id=".EA.B0.9C.EC.9A.94"><span class="mw-headline-number">1</span> 개요</span><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/index.php?title=HTML&action=edit&section=8" title="부분 편집: 개요">편집</a><span class="mw-editsection-bracket">]</span></span></h2> <div class="thumb tright"><div class="thumbinner" style="width:302px;"><a href="/wiki/%ED%8C%8C%EC%9D%BC:Html-helloworld.png" class="image"><img alt="" src="/images/thumb/8/8f/Html-helloworld.png/300px-Html-helloworld.png" class="thumbimage" srcset="/images/8/8f/Html-helloworld.png 1.5x, /images/8/8f/Html-helloworld.png 2x" width="300" height="215"></a> <div class="thumbcaption"><div class="magnify"><a href="/wiki/%ED%8C%8C%EC%9D%BC:Html-helloworld.png" class="internal" title="실제 크기로"></a></div>메모장에서 <a href="/wiki/HTML5" title="HTML5">HTML5</a>로 작성한 Hello, world!</div></div></div> <p><b>HyperText Markup Language</b>. 웹 페이지를 구성하는 마크업 언어로, 지금 당신이 보고 있는 이 페이지도 HTML로 이루어져 있다. </p><p>이 문서는 리브레 위키 <a href="/wiki/%EB%B6%88%EB%AC%B8%EC%9C%A8" title="불문율">암묵의 룰</a>에 따라 HTML로 작성되었다. </p> <h2><span class="mw-headline" id=".ED.83.9C.EA.B7.B8"><span class="mw-headline-number">2</span> 태그</span><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/index.php?title=HTML&action=edit&section=9" title="부분 편집: 태그">편집</a><span class="mw-editsection-bracket">]</span></span></h2> <p>HTML은 기본적으로 <b>태그</b>라는 방식으로 마크업을 하게 된다. 태그는 부등호"< >"가 태그 이름, 속성 및 속성값을 감싸는 형태로 되어 있고, 보통은 원하는 부분 앞뒤로 시작 태그와 종료 태그를 달아서 범위를 지정한다. 이 경우 종료 태그에는 앞에 슬래시(</>)가 들어간다. </p><p>예외적으로 <code><br></code>처럼 종료 태그가 없는 단일 태그도 있다.<sup id="cite_ref-2" class="reference"><a href="#cite_note-2"><span class="reference-hooker">[1]</span></a></sup> <a href="/index.php?title=XHTML&action=edit&redlink=1" class="new" title="XHTML (없는 문서)">XHTML</a>에서는 이런 단일 태그라도 종료 태그를 삽입해야 한다. 이 경우 <br>처럼 태그 내부에 띄어쓰기와 슬래쉬을 넣으면 된다.<sup id="cite_ref-3" class="reference"><a href="#cite_note-3"><span class="reference-hooker">[2]</span></a></sup> </p> <h2><span class="mw-headline" id=".EC.86.8D.EC.84.B1"><span class="mw-headline-number">3</span> 속성</span><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/index.php?title=HTML&action=edit&section=10" title="부분 편집: 속성">편집</a><span class="mw-editsection-bracket">]</span></span></h2> <p>속성은 시작 태그 안에 들어가서 태그에 대한 추가적인 설명을 한다. 일반적으로는 <code>속성="속성값"</code>의 형태를 취한다. </p><p>속성은 태그에 따라 반드시 들어가야 하는 속성도 있고, 그렇지 않은 속성도 있다. </p> <h2><span class="mw-headline" id="HTML5"><span class="mw-headline-number">4</span> HTML5</span><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/index.php?title=HTML&action=edit&section=11" title="부분 편집: HTML5">편집</a><span class="mw-editsection-bracket">]</span></span></h2> <p><a href="/wiki/2015%EB%85%84" title="2015년">2015년</a> 현재 HTML의 가장 최신 버전은 <a href="/wiki/HTML5" title="HTML5">HTML5</a>로, 자세한 사항은 항목을 참고할 것. </p> <h2><span class="mw-headline" id=".EA.B0.99.EC.9D.B4_.EB.B3.B4.EA.B8.B0"><span class="mw-headline-number">5</span> 같이 보기</span><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/index.php?title=HTML&action=edit&section=12" title="부분 편집: 같이 보기">편집</a><span class="mw-editsection-bracket">]</span></span></h2> <ul><li> <a href="/wiki/Iframe" title="Iframe">iframe</a> /a /li</li></ul> <h2><span class="mw-headline" id=".EA.B0.81.EC.A3.BC"><span class="mw-headline-number">13</span> 각주</span><span class="mw-editsection"><span class="mw-editsection-bracket">[</span><a href="/index.php?title=HTML&action=edit&section=13" title="부분 편집: 각주">편집</a><span class="mw-editsection-bracket">]</span>

---

이 문서는 암묵의 룰로 작성되었습니다.

위키러님의 눈이 이상한 게 아닙니다.당황하지 말고 이 문서의 룰을 파악해 보세요.

1 개요

HTML5로 작성한 HTML 예제

HyperText Markup Language. 웹 페이지를 구성하는 마크업 언어로, 지금 당신이 보고 있는 이 페이지도 HTML로 이루어져 있다.

이 문서는 리브레 위키 암묵의 룰에 따라 HTML로 작성되었다.

2 태그

HTML은 기본적으로 태그라는 방식으로 마크업을 하게 된다. 태그는 부등호"< >"가 태그 이름, 속성 및 속성값을 감싸는 형태로 되어 있고, 보통은 원하는 부분 앞뒤로 시작 태그와 종료 태그를 달아서 범위를 지정한다. 이 경우 종료 태그에는 앞에 슬래시(</>)가 들어간다.

예외적으로 <br>처럼 종료 태그를 넣지 않아도 되는 단일 태그(홀태그)도 있다. XHTML에서는 이런 단일 태그라도 종료 태그를 삽입해야 한다.

3 속성

속성은 시작 태그 안에 들어가서 태그에 대한 추가적인 설명을 한다. 일반적으로는 속성="속성값"의 형태를 취한다.

속성은 태그에 따라 반드시 들어가야 하는 속성도 있고, 그렇지 않은 속성도 있다.

4 HTML5

2015년 현재 HTML의 가장 최신 버전은 HTML5로, 자세한 사항은 항목을 참고할 것.

5 같이 보기

• iframe