Learn HTML & CSS. 8.Box model

Review what I learned

1. 모든 HTML 요소들은 박스로 둘러싸여져 있다.


2. 박스는 2차원으로 width와 height 성분이 있다. 이들은 각각 width 속성과 height 속성으로 설정이 가능하다.


3. width, height 속성들은 pixels, ems, percentages 의 세 단위로 입력될 수 있다. 이는 px, em, % 이다.


4. 박스들의 width와 height의 최댓값, 최솟값을 설정할 수 있다. 이는 사용자들이 브라우저 크기를 조정할 때 내용들이 읽기 쉽게 유지될 수 있도록 도와준다. 각각 max-width max-height min-width min-height 로 설정할 수 있다.


5. 박스의 크기가 너무 작아지면, 내용들이 잘려서 보이지 않게 된다. 이를 조절할 수 있는 속성이 overflow 이다. overflow의 설정 값으로는 hidden, scroll이 있다.
   hidden은 기본값으로 보이지 않게 하고, scroll은 넘어갈 경우 scroll해서 볼 수 있게 해준다.

출처 : codecademy(HTML & CSS)