728x90
5
CSS로 요소를 안보이게 하는 방법
css에서 요소를 안보이게 하는 방법은 여러가지가 있습니다. 잘 알아두었다가, 상황에 맞는 속성을 사용하도록 합니다.
| 작성법 | 애니메이션 가능 여부 | 영역 조작(존재) 여부 | 기타 |
|---|---|---|---|
| display: none; | X | X | 요소를 보이지 않게 함. |
| opacity: 0; | O | O | 영역이 잡힌 상태로 안보이기 때문에, 영역이 필요할 때 이 방법을 사용하도록 하자 |
| visibility: hidden; | X | X | 보이지 않게 숨겨진 상태 |
| transform: scale(0); | O | X | 크기가 0인 상태. 보이지 않지만 애니메이션 효과를 줄 수 있다. |
| width: 0; height: 0; |
X | X | blind 효과를 줄 때 사용하는 방법 |
728x90
'CSS' 카테고리의 다른 글
| 방구석 정보통 : VScode에서 Scss 사용하기 (3) | 2022.09.19 |
|---|---|
| CSS 색상 표현법 알아보기 (5) | 2022.08.23 |
| CSS 단위 알아보기 : 절대 단위와 상대 단위 (6) | 2022.08.23 |
| background 속성 알아보기 (5) | 2022.08.21 |
| IR 효과(기법) 알아보기 (5) | 2022.08.21 |
댓글