[HTML#07] HTML DIV태그, P태그

div 태그는 영역을 설정하는 태그이다. 기초공사와 같이 말이다. 

Java GUI에서 JPanel과 동일한 역할이다.

디자인에서 매우 중요한 역할을 수행한다.

정렬을 사용할 수 있다.

한 줄에 하나씩 나온다. 

<div></div>와 같이 사용하면된다.

옵션으로 align을 먼저 보자면,

<div align="left">div태그 샘플</div>

<div align="center">div태그 샘플</div>

<div align="right">div태그 샘플</div>

라고하면

div태그 샘플

                                        div태그 샘플

                                                                            div태그 샘플

이런식으로 미리보기창에 출력이 되는 것을 볼 수 있다.

 

만약 어떤 하이퍼링크 이미지 5개를 나열할때, <div align="center"> <a href로 만든 하이퍼링크 이미지들> </div>

하면 가운데로 정렬된다.

 

하나의 브라우저엔 여러 레이아웃으로 나뉜다. 하지만 대부분 사이트는 레이아웃이 비슷하다.

홈페이지 상단엔 로고가 있고, 검색창이 있으며, 가운데는 메뉴가 있다. 메일, 뉴스, 지도, 등등

그 후 아래에는 뉴스나 여러 정보들이 나오고 제일 하단에는 회사, 고객센터번호, 주소, 전화번호 등등이 있고,

오른쪽엔 로그인창 등 비슷하게 되어있다. 

꼭 정해져있는 것은 아니지만, 사용자들의 편리에 맞게 이렇게 구성되어 가고 있다.

홈페이지는 보통

최상단의 <header>, 그 아래 <nav> 그리고 두공간으로 분류되는데 왼쪽아래는 <section><Heading><article> 오른쪽은 <aside>그리고 제일 아래엔 <footer>로 구성되어 있다.

 

 

p태그는 div태그와 비슷하지만, div는 여백이 없지만, p태그는 여백이있다. 

p태그는 문단태그이며, 뉴스 기사 본문과 같은 곳에 많이 쓰인다. 어떤 문단과 문단을 끊어서 보일때 주로 사용이된다.

따라서 정렬이 크게 필요가 없다. 이미 정렬이 되어 있기 때문에 말이다.