HyperText Markup Language
웹페이지의 틀을 만드는 언어
HTML은 tag들의 집합
- Tag: 부등호(<>)로 묶인 HTML의 기본 구성 요소
<!DOCTYPE html>
<html>
<head>
<title>Page title</title>
</head>
<body>
<h1> Hello World</h1>
<div>Contents here
<span>Here Too!</span>
</div>
</body>
</html>-
HTML 확장자 사용
-
HTML은 Tree Structure로 이루어져 있다.
HTML은 Self-Closing Tag를 할 수 있으며, 예제는 다음과 같다.
<img src="codestates-logo.png"></img>
<img src="codestates-logo.png" />HTML에서 가장 많이 사용하는 TAG
<'div> : 한 줄을 차지하는 tag
<'span> : 컨텐츠 크기만큼 공간을 차지하는 tag
<'img> : 이미지 삽입 태그
<'a> : 링크 삽입 태그
<'ul>, <'li> : 리스트 태그
Hello World!
<div> div 태그는 한 줄을 차지한다 </div>
<div> division 2 </div>
<span> span 태그는 컨텐츠 크기만큼 공간을 차지한다 </span>
<span> span 2 </span>
<span> span 3 </span>
<div> division 3 </div>
<img src="https://i.imgur.com/JVAj4t0.jpg">
<a href="http://www.naver.com" target="_blank">네이버</a>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3 has nested list
<ul>
<li>Item 3-1</li>
</ul>
</li>
</ul>
<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3 has nested list
<ol>
<li>Item 3-1</li>
</ol>
</li>
</ol>
<input type="text" placeholder="type here">
<div>
<input type="radio" name="choice" value="a"> a
<input type="radio" name="choice" value="b"> b
</div>
<textarea></textarea>
<div>
<input type="checkbox" checked> checked
<input type="checkbox"> unchecked
</div>
<div>
<button>Submit</button>
</div>
</body>
자 이제 시작이야 내 꿈을