(CSS)display-none과 visibility-hidden의 차이

display: none과 visibility: hidden 둘 다 요소를 숨겨주는 기능을 한다.
하지만 차이점이 있다.

1.visibility: hidden

.box1{
  visibility: hidden;
}

visibility는 요소는 사라지지만 눈에만 안보일 뿐 영역은 그대로 남아있다.

2.display: none

.box1{
  display: none;
}

display: none은 요소가 사라지며 영역도 차지하지 않는다.