HTML css js implementiert Tab-Seite Beispielcode

Code kopieren

Der Code lautet wie folgt:

<html xmlns="">
<Kopf>
<meta http-equiv="Inhaltstyp" content="text/html; charset=gbk" />
<meta http-equiv="Inhaltssprache" content="zh-CN" />
<meta name="Wurzeln" content="" />
<meta name="Schlüsselwörter" content="" />
<meta name="Beschreibung" content="" />
<Titel></Titel>
<style type="text/css">
body{font:"Schriftgröße";font-size:12px;}
a:link,a:besucht{font-size:12px;color:#666;text-decoration:none;}
a:hover{color:#ff0000;text-decoration:underline;}
#Tab{margin:0 auto;width:220px;border:1px solid #BCE2F3;}
.Menubox{height:28px;border-bottom:1px solid #64B8E4;background:#E4F2FB;}
.Menubox ul{list-style:none;margin:7px 40px;padding:0;position:absolute;}
.Menubox ul li{float:left;Hintergrund:#64B8E4;Zeilenhöhe:20px;Anzeige:Block;Cursor:Zeiger;Breite:65px;Textausrichtung:Mitte;Farbe:#fff;Schriftstärke:fett;Rahmen oben:1px durchgezogen #64B8E4;Rahmen links:1px durchgezogen #64B8E4;Rahmen rechts:1px durchgezogen #64B8E4;}
.Menubox ul li.hover{Hintergrund:#fff;Rahmen:1px durchgezogen #fff;Farbe:#147AB8;}
.Contentbox{clear:both;margin-top:0px;border-top:none;height:181px;padding-top:8px;height:100%;}
.Contentbox ul{list-style:none;margin:7px;padding:0;}
.Contentbox ul li{line-height:24px;border-bottom:1px gepunktet #ccc;}
</Stil>
<Skript>

</Skript>
</Kopf>
<Text>

<div id="Tab">
<div Klasse="Menübox">
<ul>
<li id="menu1" onmouseover="setTab('menu',1,2)" class="hover">Berufsbildende höhere Schulen</li>
<li id="menu2" onmouseover="setTab('menu',2,2)" >Privatschulen</li>
</ul>
</div>
<div Klasse="Inhaltsbox">
<div id="con_menu_1" class="hover">
<ul>
<li>·<a href="#">Beijing Industrie-, Berufs- und Technik-College</a></li>
<li>·<a href="#">Berufskolleg für Finanzen und Handel Peking</a></li>
<li>·<a href="#">Berufsuniversität Tianjin</a></li>
<li>·<a href="#">Berufs- und Fachhochschule Dalian</a></li>
<li>·<a href="#">Liaoning-Kommunikationshochschule</a></li>
<li>·<a href="#">Berufsfachschule für Finanzen Zhejiang</a></li>
<li>·<a href="#">Handels- und Berufsfachschule Shandong</a></li>
<li>·<a href="#">Berufs- und Fachhochschule Ningbo</a></li>
<li>·<a href="#">Berufs- und Fachhochschule Wuhan</a></li>
</ul>
</div>
<div id="con_menu_2" style="Anzeige:keine">
<ul>
<li>·<a href="#">Hochschule Jiangxi Lantian</a></li>
<li>·<a href="#">Universität für Internationale Studien Xi'an</a></li>
<li>·<a href="#">Hunan-Universität für internationale Wirtschaft und Ökonomie</a></li>
<li>·<a href="#">Xi'an Übersetzungsinstitut</a></li>
<li>·<a href="#">Sanjiang-Hochschule</a></li>
<li>·<a href="#">Universität Peking</a></li>
<li>·<a href="#">Huanghe Hochschule für Wissenschaft und Technologie</a></li>
<li>·<a href="#">Jilin Huaqiao Fremdsprachenhochschule</a></li>
<li>·<a href="#">Zhejiang-Shuren-Universität</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>

<<: Eine kurze Erläuterung der MySQL-Benutzerberechtigungstabelle

>>: Serielle und parallele Operationen in JavaScript

Der Grund, warum MySQL den B+-Baum als zugrunde liegende Datenstruktur verwendet

HTML css js implementiert Tab-Seite Beispielcode

Der Grund, warum MySQL den B+-Baum als zugrunde liegende Datenstruktur verwendet

Detaillierte Erläuterung des MySQL 5.7.9-Shutdown-Syntaxbeispiels

MySQL 5.6.23 Installations- und Konfigurations-Umgebungsvariablen-Tutorial

Detaillierte Erklärung des Linux-Netstat-Befehls

Implementierung von Nginx Hot Deployment

So erzielen Sie mit CSS einen Daten-Hotspot-Effekt

So fügen Sie einem laufenden Docker-Container dynamisch ein Volume hinzu

WeChat-Applet-Picker - Mehrspalten-Selektor (Modus = MultiSelector)

So verwenden Sie die Positionierung, um Elemente zu zentrieren (Tipps zum Webseiten-Layout)

Keep-Alive-Multilevel-Routing-Cache-Problem in Vue

Artikel empfehlen

Diskussion über CSS-Stilpriorität und kaskadierende Reihenfolge

Mysql-Timeline-Daten, um die ersten drei Daten desselben Tages zu erhalten

Schritte zum Einrichten einer HTTPS-Website basierend auf Nginx

Detaillierte Erläuterung des Prinzips der Vue-Überwachungsdaten

Einführung in die Vue-Grundlagen: Installation und Verwendung von Vuex

Detaillierte Erklärung der MySQL 30-Militärregeln

Der Unterschied zwischen Vue-Interpolationsausdruck und V-Text-Direktive

Schritte zur Linux-Bridge-Methode zum Überbrücken zweier virtueller VirtualBox-Netzwerke

Lassen Sie uns über den Unterschied zwischen MyISAM und InnoDB sprechen

Verwenden Sie JavaScript, um Seiteneffekte zu erstellen

Vue verwendet Mixins zur Optimierung von Komponenten

Lösung für die in Firefox oder IE nicht ermittelte Spannweite

Mysql-Operation zum Abrufen von Tabellenkommentarfeldern

Eine kurze Erläuterung der HTML-Tabellen-Tags

1 Minute Vue implementiert Rechtsklickmenü