HTML 블록(block)과 인라인(inline)

💡: 블록요소(block element)와 인라인요소(inline element)의 가장 큰 차이는 요소들을(elements)을
어떻게 쌓아가는가에 대한 차이다.

[ block 요소 ]

: 블록처럼 아래로 쌓는 특징

1. 한 줄에 하나만 포함할 수 있음 = 기본 너비값: 100% (폼 엘리먼트 제외)
2. 너비값, 높이값 (width, height) 가질 수 있음.
3. 상하좌우 모든 마진 가질 수 있음

구분	태그 종류	설명
block	<address></address>	문서나 글의 저자 또는 회사와 연락할 수 있는 정보를 명시할 때 사용
	<article></acticle>	해당 문서나 페이지 또는 사이트와는 완전히 독립적으로 구성할 수 있는 요소를 정의할 때 사용
	<aside></aside>	페이지의 다른 콘텐츠들과 약간의 연관성을 가지고 있지만, 해당 콘텐츠들로부터 분리시킬 수 있는 콘텐츠로 구성된 페이지 영역을 정의할 때 사용
	<blockquote></blockquote>	다른 출처로부터 인용된 블록을 정의할 때 사용하며, 이렇게 인용된 블록을 브라우저는 보통 들여쓰기를 사용
	<canvas></canvas>	주로 자바스크립트와 같은 스크립트를 이용하여 그래픽 콘텐츠를 그릴 때 사용
	<dd></dd>	용어와 그에 대한 설명을 리스트 형식으로 보여주는 <dl> 요소에서 설명(description) 부분을 정의할 때 사용
	<div></div>	HTML 문서에서 특정 영역(division)이나 구획(section)을 정의할 때 사용
	<dl></dl>	용어(term)와 그에 대한 설명(description)을 리스트 형식으로 정의할 때 사용
	<hr>	콘텐츠 내용에서 주제가 바뀔 때 사용할 수 있는 수평 가로선을 정의할 때 사용
	<header></headerr>	문서나 특정 섹션(section)의 헤더(header)를 정의할 때 사용
	<form></form>	용자로부터 입력을 받을 수 있는 HTLM 입력 폼(form)을 정의할 때 사용
	<h1~6>~</h1~6>	HTML 문서에서 제목(heading)을 정의할 때 사용
	<table></table>	데이터를 포함하는 셀(cell)들의 행과 열로 구성된 2차원 테이블을 정의할 때 사용
	<pre></pre>	미리 정의된 형식(preformatted)의 텍스트를 정의할 때 사용
	<ul></ul>	순서가 없는 HTML 리스트(list)를 정의할 때 사용
	<ol></ol>	순서가 있는 HTML 리스트(list)를 정의할 때 사용
	<p></p>	문단(paragraph)을 정의할 때 사용
	<video></video>	무비 클립(movie clip)이나 비디오 스트림(video stream)과 같은 비디오를 정의할 때 사용

[ inline 요소 ]

: TXT처럼 옆으로 쌓는 특징

1. 한 줄에 여러 요소를 포함할 수 있음 = 기본 너비값: 컨텐츠 너비값
2. 너비값, 높이값을 가질 수 없음. (폼 엘리먼트, 이미지 제외)
3. 상, 하단 마진을 가질 수 없음.
4. block은 inline을 포괄하는 더 큰 개념( inline 태그 안에 block 태그 사용 금지 )

구분	태그 종류	설명
inline	<a></a>	하나의 페이지에서 다른 페이지를 연결할 때 사용하는 하이퍼링크(hyperlink)를 정의할 때 사
	<i></i>	기본 텍스트와는 다른 분위기나 음성을 위한 텍스트 영역을 정의할 때 사용
	<span></span>	HTML 문서에서 인라인 요소(inline-element)들을 하나로 묶을 때 사용
	<addr></addr>	“W3C”, “HTML”, “ASAP” 등과 같이 단어의 축약형(abbreviation)이나 머리글자로만 된 단어(acronym)를 정의할 때 사용
	<img>	HTML 문서에서 이미지(image)를 정의할 때 사용
	<strong></strong>	해당 콘텐츠의 중요성이나 심각함, 긴급함 등을 강조할 때 사용
	<b>	른 부가적인 목적 없이 단순히 굵게 표현되는 텍스트를 정의할 때 사용
	<input>	사용자로부터 입력을 받을 수 있는 입력 필드(input filed)를 정의할 때 사용
	<sub></sub>	아랫첨자(subscript) 텍스트를 표현할 때 사용
	<br>	텍스트 내의 줄바꿈(line-break)을 정의할 때 사용
	<code></code>	컴퓨터 코드(code)의 일부분을 나타낼 때 사용
	<em></em>	강조된 텍스트(emphasized text)를 표현할 때 사용
	<small></small>	글자 크기가 작은 텍스트를 정의할 때 사용
	<tt></tt>	텔레타이프 텍스트(teletype text)를 나타낼 때 사용
	<map></map>	클라이언트 사이드 이미지맵(client-side image-map)을 정의할 때 사용
	<textarea></textarea>	사용자가 여러 줄의 텍스트를 입력할 수 있는 텍스트 입력 영역을 정의할 때 사용
	<label></label>	사용자 인터페이스(UI) 요소의 라벨(label)을 정의할 때 사용
	<sup></sup>	윗첨자(superscript) 텍스트를 표현할 때 사용
	<q></q>	짧은 인용구(short quotation)를 정의할 때 사용
	<button></button>	클릭할 수 있는 버튼을 정의할 때 사용
	<cite></cite>	책이나 음악, 영화, 예술 작품 등과 같은 창작물의 제목을 정의할 때 사용