>  기사  >  웹 프론트엔드  >  CSS 요소를 숨기는 방법

CSS 요소를 숨기는 방법

coldplay.xixi
coldplay.xixi원래의
2021-04-16 16:05:204490검색

CSS 요소를 숨기는 방법: 1. opacity 속성은 요소의 투명도를 설정하는 것을 의미합니다. 2. Visibility는 요소를 숨기기 위해 값을 숨김으로 설정합니다. 3. 표시 속성은 실제로 요소를 숨깁니다. 단어.

CSS 요소를 숨기는 방법

이 튜토리얼의 운영 환경: windows7 시스템, CSS3 버전, DELL G3 컴퓨터.

CSS 요소를 숨기는 방법:

1. Opacity

opacity 속성은 요소의 투명도를 설정하는 것을 의미합니다. 요소의 경계 상자를 변경하도록 설계되지 않았습니다. 즉, 불투명도를 0으로 설정하면 요소가 시각적으로만 숨겨집니다. 요소 자체는 여전히 자체 위치를 차지하고 웹 페이지 레이아웃에 기여합니다.

css 코드:

.hide {
  opacity: 0;
}

2, Visibility

값을 숨김으로 설정하면 요소가 숨겨집니다. 불투명도 속성과 마찬가지로 숨겨진 요소도 웹 페이지 레이아웃에 영향을 미칩니다.

.hide {
   visibility: hidden;
}

3. Display

디스플레이 속성은 단어의 의미에 따라 요소를 실제로 숨깁니다. 표시 속성을 없음으로 설정하면 요소가 표시되지 않고 상자 모델도 생성되지 않습니다. 이 속성을 사용하면 숨겨진 요소가 공간을 차지하지 않습니다.

.hide {
   display: none;
}

관련 튜토리얼 추천: CSS 비디오 튜토리얼

위 내용은 CSS 요소를 숨기는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.