css 가시성 제어(overflow/visibility/display)

visibility

---

요소를 화면에서 show/hide 시킬 수 있으며

화면에서 가려지나 그 자리는 지키고 있다.

 

visibility:hidden;

 

속성값

- visible : 요소가 보임.

- hidden : 요소가 보이지 않지만 공간을 잡고 있기때문에 레이아웃에 영향을 미친다.

- inherit : 부모 요소의 값을 상속

 

 

display

---

요소를 표시하는 방법을 지정한다.

 

display:none;

요소가 완전히 사라진다. 공간도 차지하지 않는다.

 

 

overflow

---

자식 요소가 부모 요소의 범위를 초과할 때 어떻게 처리할지 결정해준다.

overflow : hidden;

부모 요소의 범위를 넘어가는 자식요소의 부분은 보이지 않도록 처리한다.