Verwenden Sie CSS, um den aktuellen Kanal in der Navigationsleiste zu markieren

In diesem Artikel wird hauptsächlich die Verwendung von CSS zum Markieren des aktuellen Kanals in der Navigationsleiste vorgestellt. Jetzt kann ich ihn mit Ihnen teilen.

Einführung in Webjx-Artikel zur Webseitenproduktion: Die Technologie zur Verwendung von CSS zum Markieren des aktuellen Kanals in der Navigationsleiste gibt es schon seit langem. Sie wurde in vielen CSS-Büchern eingeführt, wird aber immer noch gefragt, deshalb habe ich einen einfachen Artikel geschrieben Beispiel, um es zu erklären.

Tatsächlich ist das Prinzip sehr einfach:
1) Definieren Sie entsprechend den verschiedenen Kanälen (Spalten) jeweils IDs für den Körper. Zum Beispiel:
Startseite:
Blog-Kanal:
Album-Kanal: Alle Seiten im Kanal müssen einheitlich definierte IDs haben.
2) Die entsprechende Spalte der Navigationsleiste definiert auch die ID oder Klasse:

<ul id="nav">
<li class="nav_home"><a href="index.html">首页</a></li>
<li class="nav_blog"><a href="blog.html">Blog</a></li>
<li class="nav_album"><a href="album.html">相册</a></li>
</ul></p>
<p style="text-align: left;">3) Die aktuelle Position wird durch verschiedene Körper-IDs unterschieden: </p>
<pre class="brush:php;toolbar:false">#p_home .nav_home a,
#p_blog .nav_blog a,
#p_album .nav_album a {
……
}

Das Obige ist der gesamte Inhalt Ich hoffe, dass dieser Artikel für das Lernen aller hilfreich ist. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website!

Verwandte Empfehlungen:

Einführung in die CSS3-Nahaufnahmekompatibilität des jQuery-Browsers

Das obige ist der detaillierte Inhalt vonVerwenden Sie CSS, um den aktuellen Kanal in der Navigationsleiste zu markieren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!