CSS Visibility vs Display

[yejineee]

둘 다 엘리먼트를 보이게하거나 숨기게 한다. DOM 내부적으로는 동작이 다르다.

Visibility:hidden;

엘리먼트를 숨기지만, 레이아웃에는 여전히 자리를 차지하고 있다.
숨겨진 엘리먼트의 자식 엘리먼트가 visible로 설정되어있다면, 자식 엘리먼트는 보일 것이다.

Display:none;

DOM에서 엘리먼트를 완전히 제거한다. 따라서, 자식 엘리먼트들 또한 보이지 않게 된다.