[HTML + CSS] Overflow

overflow

box의 크기가

 텍스트(이미지 포함)의 

내용보다 

작을 때 사용

1. overflow: visible (기본) 

box 바깥으로 넘치는 텍스트를 다 보여줌

2. overflow: hidden

box 바깥의 내용은 보여주지 않고 숨김

예) border-radius: 10px; 처리된 box에서 삐져 나오는 이미지의 직각 모서리는 overflow: hidden; 해 주면 사라진다.

3. overflow: scroll 

box 바깥의 넘치는 내용을 스크롤바를 통해서 보여줌. 텍스트가 box 크기보다 크든지 작든지 상관없이 무조건 스크롤바가 생김

4. overflow: auto 

텍스트가 box 크기 이하이면 그대로 보여주고, box보다 크면 스크롤바를 생성하여 보여줌