[CSS] visibility 속성

개인적으로 잘 안 외워지는 css 속성중에서 visibility 속성에 대해 얘기 하려 합니다.

visibility 속성은 display 속성과 비슷하다고 말할 수 있지만

다른점은 display 의 none 속성값은 태그와 차지하고 있는 영역까지 숨겨 Layout 을 흐트릴 수 있지만

visibility 의 hidden 속성은 태그를 숨기지만 차지하고 있는 영역은 그대로 유지해 줍니다.

visibility 속성의 값은 다음과 같습니다.

visible	기본 값. 태그의 요소를 보여줍니다.
hidden	태그의 영역을 숨깁니다. (영역은 유지)
collapse	table 태그에만 적용되며, tr과 td태그를 안보이게 합니다.(영역은 유지)
inherit	부모요소의 값을 상속 받습니다.

작성방법은 아래와 같습니다.

.box{visibility:visible;}
.box{visibility:hidden;}
.box{visibility:collapse;}
.box{visibility:inherit;}