div태그는 Division의 약자로 웹사이트의 레이아웃(전체적인 틀)을 만들때 주로 사용한다.
div는 웹페이지에서 논리적 구분을 정의하는 태그이다.
div 태그를 사용하여 각각의 블록(공간)을 알맞게 배치하고 CSS를 활용하여 스타일을 적용할 수 있다.
요즘에는 레이아웃 배치를 거의 div를 활용해 구성하는 추세
| 태그 | 속성 | 내용 |
| <div> | style | 스타일 |
| width | 가로크기 | |
| height | 세로크기 | |
| border | 테두리 굵기 | |
| background - color | 배경 색상 | |
| float | 정렬 | |
| margin | 여백 |
예제
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<div>
<h1>MY HOMEPAGE</h1>
<hr/>
</div>
<div>
<ul>
<li>HTML5</li>
<li>CSS3</li>
<li>JAVA</li>
<li>MYSQL</li>
</ul>
<hr/>
</div>
</body>
</html>결과화면
'Frontend > HTML+CSS' 카테고리의 다른 글
| keyframes animation 실습 (0) | 2023.03.08 |
|---|---|
| 나만의 일기장 CSS 사용해서 만들기(실습) (0) | 2023.03.08 |
| [ HTML ] HTML 기본 (0) | 2021.11.10 |
