Heim > Web-Frontend > CSS-Tutorial > Hauptteil

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

WBOY
Freigeben: 2021-11-24 16:33:38
Original
2977 Leute haben es durchsucht

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>
Nach dem Login kopieren

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>
Nach dem Login kopieren

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!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage