Detaillierte Erläuterung der vier versteckten Methoden des CSS-Codes

1.opacity:0 verbirgt nur das Element, belegt aber immer noch das Layout, sodass es immer noch Auswirkungen auf das Layout hat

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

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

2.Sichtbarkeit: versteckt verbirgt immer noch nur das Element, belegt aber immer noch das Layout

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

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

3.display:none hat keinen Einfluss auf das Layout

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

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

4.position:absolute hat keinen Einfluss auf das Layout

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

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

Die oben genannten vier Haben Sie gelernt, sich zu verstecken? Beeilen Sie sich und probieren Sie es aus.

Verwandte Empfehlungen:

Umfassende Zusammenfassung des Wissens über die Vererbung von Attributwerten in CSS

Umfassende Methoden zum Anpassen von Textauslassungen in reinem CSS

Zusammenfassung der 20 erweiterten CSS-Tipps

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der vier versteckten Methoden des CSS-Codes. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!