728x90
요소를 숨기는 법
요소를 숨기는 법은 총 다섯가지가 있습니다. 한번 살펴봅시다.
01. display를 사용하는 방법
요소가 있는 블럭을 건드리는 방법입니다. 영역을 없애버리면서 애니메이션도 쓸 수 없게 만듭니다.
.원하는 영역 { display : none; }
02. opacity 사용하는 방법
투명도를 조절하는 방법 입니다. 영역도 살릴 수 있고 애니메이션도 사용할 수 있습니다.
.원하는 영역 { opacity : 0; } // 투명도를 0으로 만듬
03. visibility 사용하는 방법
레이아웃을 변경하지 않고 요소를 보이거나 숨기는 방법입니다. 영역을 없애버리면서 애니메이션도 쓸 수 없게 만듭니다.
.원하는 영역 { visibility : hidden; } //숨긴다
04. whidth와 height값을 건드는 방법
높이값과 넓이값을 없애는 방법입니다. 영역을 없애버리면서 애니메이션도 쓸 수 없게 만드는 방법입니다.
.원하는 영역 { whidth : 0; height: 0; }
05. transform을 사용하는 방법
크기를 주지 않는 방법입니다. 영역을 없애버리지만 애니메이션은 사용할 수 있습니다.
.원하는 영역 { transform: scale(0); }
728x90
반응형
'CSS' 카테고리의 다른 글
움직이는 애니메이션2 (8) | 2022.08.29 |
---|---|
움직이는 애니메이션 1 (7) | 2022.08.29 |
색상표현 (7) | 2022.08.24 |
단위 (4) | 2022.08.24 |
이미지스프라이트 (4) | 2022.08.22 |
댓글