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

Kennen Sie die seltsamen Dinge in Javascript?

MySQL-Sortierung nach konventioneller Sortierung, benutzerdefinierter Sortierung und Sortierung nach chinesischen Pinyin-Buchstaben

Normale MySQL-Sortierung, benutzerdefinierte Sort...

HTML css js implementiert Tab-Seite Beispielcode

Kennen Sie die seltsamen Dinge in Javascript?

Tutorial zur Installation und Konfiguration der kostenlosen Installationsversion von MySQL 5.7.20\5.7.21

Detaillierte Schritte zur Installation von MySQL mit Cluster-RPM

Zwei Möglichkeiten, mit IIS X-Forwarded-For Header (XFF) aufzurufen, um die tatsächliche IP des Besuchers aufzuzeichnen

Tiefgreifendes Verständnis der Matching-Logik von Server und Standort in Nginx

Beispiele für die Verwendung einer Link-Aktualisierungsseite und einer JS-Aktualisierungsseite

So installieren und konfigurieren Sie Redis in CentOS7

Einführung in den Prozess der Erweiterung der Bootpartition in Kylin 4.0.2 (Ubuntu)

Vollständige Schritte zum Erstellen eines Passwortgenerators mit Node.js

Detailliertes Tutorial zur Installation und Konfiguration von Nginx unter Centos7

Artikel empfehlen

Verwendung des Linux-Telnet-Befehls

Neuer Ansatz zum Umschalten der Tab-Leiste mit zwei Auswahlmöglichkeiten in Vue

So zeigen Sie die MySQL-Zeitzone an und legen sie fest

So löschen Sie Dateinamen oder Verzeichnisse mit Sonderzeichen in Linux

JavaScript zum Implementieren eines Dropdown-Listenauswahlfelds

Eine detaillierte Erklärung, wie React Fiber funktioniert

Analyse der HTTP-Dienstschritte auf einer virtuellen VMware-Maschine

Detailliertes Tutorial zum PyCharm- und SSH-Remote-Access-Server-Docker

Verwendung der VUE-Renderfunktion und ausführliche Erklärung

MySQL-Sortierung nach konventioneller Sortierung, benutzerdefinierter Sortierung und Sortierung nach chinesischen Pinyin-Buchstaben

mysql ersetzt einen Teil des Feldinhalts und mysql ersetzt die Funktion replace()

Javascript kombiniert mit Vue zur automatischen Pfadfindung für jedes Labyrinthbild

Detaillierter Prozess der NTP-Serverkonfiguration unter Linux

Detaillierte Erklärung der Speicher-Engine in MySQL

Verwendung des Linux-Befehls sed