CSS 코드의 네 가지 숨겨진 메소드에 대한 자세한 설명

1.opacity:0은 요소만 숨기지만 여전히 레이아웃을 차지하므로 여전히 레이아웃에 영향을 줍니다

<pclass="p1">
snda:opacity:0只是把元素隐藏起来了 ，但是还是占有布局，所以还是对布局有影响
</p>
<p>ppskdkad</p>

.p1{
opacity:0;
width:200px;
height:200px;
border:1pxsolidred;
}

2.visibility:hidden은 여전히 ​​요소를 숨기기만 하지만 여전히 레이아웃을 차지합니다

<pclass="p2">
这是第二个p visibility:hidden还是只是把元素隐藏了，但是还是占有布局
</p>
<p>看看效果</p>

.p2{
visibility:hidden;
width:200px;
height:200px;
border:1pxsolidred;
}

3.display:none은 레이아웃에 영향을 주지 않습니다

<pclass="p3">
这是第三个p display:none不会影响到布局
</p>
<p>不信你看</p>

.p3{
display:none;
width:200px;
height:200px;
border:1pxsolidred;
}

4.position:absolute는 레이아웃에 영향을 주지 않습니다

<pclass="p4">
这个是第四个p 我觉得也不会影响到布局 但是到底会不会 一起来看看吧 果然这个也不会影响到布局
</p>
<p>看看</p>v

.p4{
position:absolute;
top:-9999px;
left:-9999px;
width:200px;
height:200px;
border:1pxsolidred;
}

위의 네 가지 숨기기 방법을 배웠나요? 서둘러서 사용해 보세요.

관련 권장 사항:

CSS의 속성 값 상속 지식에 대한 종합 요약

순수 CSS에서 텍스트 생략을 사용자 정의하는 종합 방법

20가지 고급 CSS 기술 요약

위 내용은 CSS 코드의 네 가지 숨겨진 메소드에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!