[html기본요소] 블록요소와 인라인요소

웹 페이지에 실질적으로 보이는 body 내부에 요소는 크게 두가지 형태로 나눌 수 있다.

html의 기본적인 규칙으로 블록 요소와 인라인 요소이다.

1. 블록요소

블록요소는 텍스트 줄바꿈, 넓이나 높이를 마음껏 사용자 입맛대로 지정할 수 있는 태그를 말한다.

간단히 말해서 박스라고 생각하면 될 것이다.

블록요소 형태의 태그입니다.

초기값 넓이는 위와 같이 100%로 가로 전체로 쭉 펴져있는 것을 알 수 있다.

 

※ 종류

address, article, aside, audio, blockquote, canvas, dd, div, dl, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, noscript, ol, output, p, pre, section, table, ul, video

2. 인라인요소

인라인요소는 블록요소와 반대로 줄바꿈이 일어나지 않는다. 넓이나 높이를 지정할 수도 없다.
텍스트의 높이, 텍스트의 길이로 넓이와 높이가 지정된다 :)

인라인 요소입니다1. 인라인 요소입니다2.

 

※ 종류

a, abbr, acronym, b, bdo, big, br, button, cite, code, dfn, em, i, img, input, kbd, label, map, object, q, samp, small, script, select, span, strong, sub, sup, textarea, tt, var

 

 

이 두가지 형태는 기본적인 규칙이 있다.

1. 같은 형태의 요소는 서로를 포함할 수 있다. 박스안에 박스가 들어가듯!

2. 블록요소 안에는 인라인요소 또한 포함이 가능하다.
   

3. 인라인요소 안에는 블록요소를 포함할 수 없다. 텍스트 안에 박스를 넣을 수는 없는 법!

블록 요소 및 인라인 요소는 스타일로 다른 요소로 바뀔 수도 있다 :) 이 부분은 참고만!