Heim  >  Artikel  >  Web-Frontend  >  So verbergen Sie übergeordnete Elemente und zeigen untergeordnete Elemente in CSS an

So verbergen Sie übergeordnete Elemente und zeigen untergeordnete Elemente in CSS an

WBOY
WBOYOriginal
2021-11-24 16:33:382976Durchsuche

In CSS können Sie das Sichtbarkeitsattribut verwenden, um das übergeordnete Element auszublenden und das untergeordnete Element anzuzeigen. Sie müssen lediglich den Stil „visibility:hidden“ zum übergeordneten Element und den Stil „visibility:visible“ zum untergeordneten Element hinzufügen .

So verbergen Sie übergeordnete Elemente und zeigen untergeordnete Elemente in CSS an

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

So verbergen Sie das übergeordnete Element und zeigen das untergeordnete Element in CSS an

Es ist sehr einfach, das übergeordnete Element auszublenden und das untergeordnete Element in CSS anzuzeigen. Sie müssen nur den Stil „visibility:hidden“ hinzufügen Fügen Sie dem untergeordneten Element einfach den Stil „visibility:visible“ hinzu, um es auszublenden, und fügen Sie dann den Stil „visibility:hidden“ hinzu.

Schauen wir uns ein Beispiel an:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div style="height:50px;width:300px;border:1px solid black;background-color:yellow;">
<p>1231231231231325654654635165</p>
</div>
</body>
</html>

Ausgabeergebnis:

So verbergen Sie übergeordnete Elemente und zeigen untergeordnete Elemente in CSS an

Nach dem Hinzufügen von Stilen zum übergeordneten Element und den untergeordneten Elementen:

<!DOCTYPE html>
<html>
<head>
<style>
div{
visibility:hidden;
}
p{
visibility:visible;
}
</style>
</head>
<body>
<div style="height:50px;width:300px;border:1px solid black;background-color:yellow;">
<p>1231231231231325654654635165</p>
</div>
</body>
</html>

Ausgabeergebnis:

So verbergen Sie übergeordnete Elemente und zeigen untergeordnete Elemente in CSS an

Das obige Beispiel ist: Das übergeordnete Element verbirgt die Anzeige untergeordneter Elemente.

(Teilen von Lernvideos: CSS-Video-Tutorial)

Das obige ist der detaillierte Inhalt vonSo verbergen Sie übergeordnete Elemente und zeigen untergeordnete Elemente in CSS an. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn