티스토리 뷰

HTML

HTML - 구역을 나눠주는 태그

오이연우오 2022. 4. 15. 18:27

HTML은 뼈대를 만드는 언어므로, 구역을 나눠주는 태그들이 있습니다.

1. <div></div>

div는 페이지를 논리적인 구간이나 그룹으로 나누어 줍니다. div를 사용하는 이유는 페이지를 논리적으로 구분해서 다른 사람들이 이해하기 쉽고, 관리도 편하게 할 수 있으며 한 구간마다 스타일을 적용할 수 있기 때문입니다.

<html>
	<body>
		<div style="background-color:cyan">구역1</div>
		<div style="width:100px; height:100px; background-color:#CF0">구역2</div>
	</body>
</html>

 

2. <p></p> 태그

p태그는 문단을 나누는 요소입니다.

<html>
	<body>
		<p>first paragraph</p>
		<p>second paragraph</p>
		<p>
			new line<br>
			third paragraph
		</p>
	</body>
</html>

3. <ui>태그

정렬되지 않은 태그를 말하며 ui 태그를 사용할때는 항상 li 태그를 같이 사용해야 합니다.

<ul>
<li>리스트를 나타낸다</li>
<li>ul이랑 같이 사용한다.</li>
</ul>

4. <ol> 태그

정렬된 태그들을 말합니다.

<ol>
    <li>아메리카노</li>
    <li>카페라떼</li>
    <li>핫초코</li>
</ol>

<ol type="A" start="10">
    <li>녹차</li>
    <li>홍차</li>
    <li>자스민차</li>
</ol>

'HTML' 카테고리의 다른 글

HTML - 엔티티(Entity)  (0) 2022.04.15
HTML - 웹 사이트 구조 이해  (0) 2022.04.15
HTML - 비트맵 그래픽 vs 벡터 그래픽  (0) 2022.04.15
HTML - 웹표준, 웹접근성, 웹호환성, 시멘틱 태그  (0) 2022.02.03
HTML - SEO(검색 엔진 최적화)  (0) 2022.01.24

UP NEXT : HTML

댓글
© 2018 webstoryboy