HTML body 내부 태그 요소 - 블록요소(block element) & 인라인 요소(inline element) 특징

블록요소(block element)

html body 내부에 작성하는 수많은 태그들중 각각의 특정들이 있는데,
크게 두분류로 나누면 블록요소(block element)와 인라인 요소(inline element)가 있다.

 

블록요소와 인라인요소 특징

블록요소(block element)

• width는 별도 지정 값이 없을 경우 기본이 100%이며, 부모 요소의 넓이 값을 영향을 받습니다.
• 요소들이 세로로 쌓이는 특징이 있습니다.
• height에 별도 지정 값이 없을 경우 내부 콘텐츠 사이즈 높이에 영향을 받습니다.
• 모둔 방향의 margin, padding, border 값을 사용합니다.
• 블록요소는 블록요소와 인라인 요소를 함께 포함할 수 있습니다.

인라인 요소(inline element)

• text level element 라고도 하며, 대부분 텍스트 속성의 영향을 받습니다.
• 요소들이 가로로 쌓이는 특징이 있습니다.
• width, height 값을 지정할 수 없으며 콘텐츠 사이즈에 영향을 받습니다.
• text 정렬 속성에 영향을 받습니다
• margin, padding, border 의 left, right 값만 사용 가능합니다.(img, input 제외)
• 블록요소를 포함하지 못하며 오로지 인라인요소만 포함이 가능합니다.