Html5_8/ 공간분할 태그 - div, span 태그
Html에서 공간을 분할하는 이유 : 공간을 분할해야 CSS를 사용해 원하는 레이아웃을 구성할 수 있다.
공간분할하는 형식은 Block형식과 Inline 형식으로 나뉜다.
block은 빌딩처럼 층층이 분할
inline은 가로로 길게 한 층을 칸칸이 분할
*공간분할 태그
<div></div> - block 형식으로 공간분할
<span></span> - inline 형식으로 공간분할
<body>
<div>Block</div>
<div>Block</div>
<div>Block</div>
<div>Block</div>
<div>Block</div>
<span>Inline</span>
<span>Inline</span>
<span>Inline</span>
<span>Inline</span>
<span>Inline</span>
<div><span>Inline</span><span>Inline</span><span>Inline</span></div>
<!--Block 형식--> h1~6 / div / p / ul / ol / li / table / form
<h1>글자</h1>
<p>글자</p>
<!--Inline형식--> span / a / input / 글자형식태그(b/i/del/sub/sup...)
<a href="">글자</a>
<b>글자</b>
<i>글자</i>
<input type="">
/*참고로 <img src="">는 inline처럼 보이는 inline-block*/
<!--html5 시멘틱 태그 (=div와 같은 기능. div대체. 웹페이지 구조를 쉽게 이해하게 하는데 의미가 있다.)-->
<header></header> - body밑에 h1태그를 감싸는 헤더태그 header>h1
<nav></nav> - 네비게이션 (카테고리 그룹) nav>ul>li<a href>
<aside></aside> - 사이드에 위치하는 공간
<section></section> - 여러 중심내용을 감싸는 공간 section>article>h1>p
<article></article> - 글자가 많이 들어가는 부분
<footer></footer>
...
</body>
