Elements를 숨기는 속성 display와 visibility

Sep 23, 2022

Elements 숨기기

요소를 숨기는 속성으로 display: none과 visibility: hidden이 있다. 이 둘이 어떻게 다른지 알아보자.

display의 none 값을 사용하면 요소가 차지하는 공간 자체를 숨길 수 있다. 화면에서 빈 공간 조차 보이지 않게 된다.

.container {
  display: none;
}

visibility의 hidden 값을 사용하면 공간은 유지하면서 내용만 숨길 수 있다.

.container {
  visibility: hidden;
}

Table Of Contents