overflow

overflow

- overflow : 요소의 크기 이상으로 내용이 넘쳤을 때, 보여짐을 제어하는 단축 속성 

• visible :넘친 내용을 그대로 보여줌 
• hidden : 넘친 내용을 잘라냄 
• scroll :넘친 내용을 잘라냄, 스크롤바 생성 x, y축 스크롤 생성 
• auto : 넘친 내용이 있는 경우에만 잘라내고 스크롤바 생성  넘친 축 방향으로 스크롤 생성 

코드펜 예제

 

See the Pen Untitled by 김선미 (@tjsalsun) on CodePen.

 

• overflow-x : x축(가로방향)으로 요소의 크기이상으로 내용이 넘쳤을때 보여짐을 제어하는 속성
• overflow-y : y축(세로방향)으로 요소의 크기이상으로 내용이 넘쳤을때 보여짐을 제어하는 속성  

---

 

TIL
overflow: auto;
내용이 흘러넘칠 때 넘친 내용을 잘라내고 넘친 내용을 읽고싶을때 스크롤 바를 생성 

 

느낀점

사용자에게 넘칠 내용을 어떻게 보여줄지 생각할 수 있다 

오늘의 학습 만족도 
⭐⭐⭐⭐⭐