HTML 블럭/인라인 요소 정리

인라인 요소

인라인 요소 특징 정리

영역	컨텐츠 크기 만큼
정렬	텍스트 정렬에 영향 받음. (텍스트의 위치를 지정하는 모든 속성)
박스모델	margin-left,right / padding, border ,float
중첩요소	인라인만 가능
특징	포지션이 텍스트와 유사하게 처리된다. (vertical-align 영향 받음)

블럭요소

블록요소 특징 정리

영역	지정 값 또는 지정 안할시 너비는 부모의 가로 크기, 세로는 컨텐츠 크기
정렬	마진(auto), 패딩 이용 (테이블 내의 경우 verertical aline)
박스모델	margin(auto 불가),padding,border ,float
중첩요소	블록,인라인 모두 가능
특징	양 옆에 요소를 둘수 없다.

인라인 블록요소

인라인 블록요소 특징 정리

영역	지정 값 또는 지정 안할시 너비는 컨텐츠 크기 만큼
정렬	텍스트 정렬에 영향 받음.(텍스트의 위치를 지정하는 모든 속성)
중첩요소	인라인만 가능
특징	포지션이 텍스트와 유사하게 처리된다. (vertical-align 영향 받음)

html5에서 추가된 기능

블록(block) 요소

블럭요소 정리

선택자	HTML사용 용도
article	아티클 콘텐츠
fieldset	필드셋 라벨
aside	어사이드 콘텐츠
figcaption	이미지 설명
blockquote	긴 인용
figure	그룹 미디어 콘텐츠 및 설명
body	페이지 바디
footer	영역 또는 페이지 푸터
br	줄바꿈
form	입력 폼
button	푸시버튼
h1-6	레벨 1-6의 헤더
canvas	드로잉 영역
head	페이지 관련 정보
caption	테이블 설명
header	섹션 또는 페이지 헤더
col	테이블 컬럼
hgroup	그룹 헤더 정보
colgroup	테이블 컬럼 그룹
hr	가로줄
dd	설명 정의
li	리스트 아이템
div	분할 영역
map	이미지 맵
dl	정의 목록
object	개체 임베딩
dt	정의 용어
ol	순서 지정 리스트
embed	외부 콘텐츠
output	폼 결과
p	단락
pre	미리 서식을 지정한 텍스트
progress	시간 소요 작업의 진행율 표시
section	웹 페이지 영역
table	테이블
tbody	테이블 바디
textarea	텍스트 입력 폼
tfoot	테이블 푸터
th	테이블 헤더
thead	테이블 헤더
tr	테이블 행
ul	순서없는 리스트
video	동영상 재생기

인라인요소(inline) 요소

인라인요소 정리

선택자	HTML사용 용도
a	앵커 링크
i	이탤릭
q	짧은 인용
abbr	줄임말
iframe	인라인 하위 윈도우
smalll	소형 인쇄
address	물리적인 주소
img	이미지 임베딩
select	선택 가능 목록
area	이미지 맵의 영역
input	입력 필드
source	미디어 리소스
audio	사운드 콘텐츠
ins	입력된 텍스트
span	지역화 적용 서식
bm	볼드 텍스트
keygen	폼에서 생성된 키
strong	굵은 강조
cite	짧은 인용
kbd	키보드 텍스트
sub	아래 첨자
code	코드 텍스트
label	폼 엘리먼트의 라벨
summary	상세정보 헤더
del	삭제된 텍스트
legend	필드셋 제목
sup	위 첨자
details	엘리먼트의 상세정보
link	리소스 참조
tbody	테이블 바디
dfn	정의된 용어
mark	마크 텍스트
td	테이블 데이터
command	명령 버튼
meter	측정 범위
time	날짜/시간
em	강조
nav	내비게이션 링크
var	변수
font	폰트 외양
optgroup	드롭다운 리스트 옵션