HTML 블록과 인라인

요소(태그)의 유형
기본 표시 값 - block, inline

block - div
항상 새 줄에서 시작. 사용 가능한 전체 너비를 차지.
- h1~h6, p, ul, ol, dl, 시맨틱 태그들 등.
inline - span
새 줄에서 시작하지 않음. 필요한 만큼만 폼을 차지.
- a, b, i, strong, em, mark 등.

-div 태그
html 요소의 컨테이너로 사용되는 태그.

 <div style="background-color:black;color: white; padding: 15px; margin:50px;">
 	<h2>Lorem Ipsum</h2>
 	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 	 Fusce tristique sem eget quam gravida, et tempus ipsum suscipit.
     Aliquam accumsan interdum leo ullamcorper egestas. Etiam at neque vulputate,
     tincidunt justo ac, rhoncus nunc. Aliquam iaculis tincidunt elit, at interdum justo.
     Nunc vel nisl auctor, rhoncus lectus vel, bibendum velit.
     Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae;
 	 Nullam vitae velit sit amet sapien lacinia consectetur.</p>
 </div>

<h3>div 공간 분할</h3>
 <div style="background-color: #ff00ff">
 	div 첫번째 영역..
 	</div>
 <div style="background-color: #00ff00">
 	div 두번째 영역..
 </div>
 <div style="background-color: #ffff00">
 	div 세번째 영역..
 </div>

 <h3>span 공간 분할</h3>
 
 <span style="background-color: #ff00ff">
 	div 첫번째 영역..
 </span>
 <span style="background-color: #00ff00">
 	div 두번째 영역..
 </span>
 <span style="background-color: #00ffff">
 	div 세번째 영역..
 </span>

<h3>공간 설정(div/span 혼용)</h3>
 <div style ="height: 70px; background-color:yellow;">
 머리말 영역</div>
 <div style ="height: 50px; background-color:green;">
 본문 영역</div>
 <span style="background-color: red">왼쪽 테스트 영역</span>
 <span style="background-color: white">가운데 테스트 영역</span>
 <span style="background-color: blue">오른쪽 테스트 영역</span>
 <div style="height: 40px; background-color: black; color:whire;"></div>