HTML Box/Item & Block/Inline 정리

HTML 구조를 볼때는 박스단위로 쪼개서 보고, 세부적으로 아이템은 사용자 입장에서 시각적인 UI이다.

Block형(div)과 Inline형(span)을 잘 이용하여 배치하자.

 

1. HTML을 볼때는 크게 박스와 아이템으로 나눠서 볼 수 있다.

아이템은 사용자 눈에 보이지만 박스는 아니다.

Box는 Sectioning이 가능한것(눈에 보이지는 않는 틀) : 묶어서 스타일링할때 사용

Item은 사용자들에게 보여지는것들.

 

 

• HTML구조를 바라보는 관점 : Header안에 여러 박스가 존재한다...Body안에 여러 박스가 존재한다...

아래와같이 쪼개서 본다.

웹사이트를 박스단위로 봐야한다.by 드림코딩엘리youtube

React를 하나의 컴포넌트로 보지말고

최고로 작은 단위로 쪼개어서 작은 단위부터 개발하는 것이 필요하다.

 

2. HTML은 Block과 Inline 형태가 있다.

Block Inline 차이

Block은 각각 다른행으로 배열되고 Inlline은 하나의 행에 배열된다.

본 블로그글 참고 : CSS 정리(선택자, Flexbox, 속성값 등)

 

 

 

 

 

 

 

www.youtube.com/watch?v=OoA70D2TE0A&list=PLv2d7VI9OotQ1F92Jp9Ce7ovHEsuRQB3Y&index=6