Gemeinschaft Lernen Tools-Bibliothek Freizeit
suchen
Deutsch
Heim > Web-Frontend > js-Tutorial > Hauptteil

Beispielcode zum Erstellen einer Navigationsleiste mit BootStrap_Javascript-Kenntnissen

WBOY
Freigeben： 2016-05-16 15:02:02
Original
1677 Leute haben es durchsucht

Was ist Bootstrap?

Bootstrap ist ein Front-End-Framework für die schnelle Entwicklung von Webanwendungen und Websites. Bootstrap basiert auf HTML, CSS und JAVASCRIPT.

Ich habe lange versucht, die Bootstrap-Navigationsleiste herauszufinden, oder die Farben sind unterschiedlich, und ich habe den Code einfach hier eingefügt und verwendet direkt in der Zukunft

Der Code lautet wie folgt: 

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-default" role = "navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">KKK</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="#">首页 <span class="sr-only"></span></a></li>
</ul>
<div class="navbar-right">
<ul class="nav navbar-nav">
<li><a href="#">haha<span class="sr-only"></span></a></li>
<li><a href="#">haha<span class="sr-only"></span></a></li>
</ul>
</div>
</div>
</div>
</nav>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Nach dem Login kopieren

Sehen Sie sich die Ergebnisse an

Beispielcode zum Erstellen einer Navigationsleiste mit BootStrap_Javascript-Kenntnissen

Das Obige ist der vom Herausgeber eingeführte Beispielcode zum Erstellen einer Navigationsleiste mit BootStrap. Ich hoffe, er wird Ihnen hilfreich sein!

Verwandte Etiketten：
bootstrap导航条
Quelle：php.cn
Vorheriger Artikel：Einführung in vier Möglichkeiten zum Binden von Ereignissen mit jQuery Nächster Artikel：Vergleich von jQuery Mobile und Kendo UI_Basics
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
Neueste Artikel des Autors
Aktuelle Ausgaben
Wie kann ich in der mobilen Ansicht diese Navigationsleiste schließen, wenn der Benutzer auf den Link klickt? Wenn der Benutzer auf einen Link klickt, um die Website zu durchsuchen, wird die Navigatio...
Aus 2024-04-06 19:23:03
0
1
411
Ausgeblendete Seitenbereiche anzeigen: aktiviert Ich hätte gerne ein Navigationsmenü im Seitenbereich mit der Möglichkeit, über ein animier...
Aus 2024-04-06 15:49:33
0
1
319
Unterer CSS-Rand in der Navigationsleiste Ich habe eine Navigationsleiste und habe unten eine rote Linie hinzugefügt, wenn der Mausz...
Aus 2024-04-06 15:04:41
0
2
347
Gibt es eine Möglichkeit, die Routenstütze in Vue festzulegen? Ich möchte zu einer bestimmten Registerkarte auf der Seite this.$router.push({name:"A...
Aus 2024-04-06 11:35:59
0
1
456
React Router verschachteltes Routing und Verwendung von Suchparametern Wenn ich Suchparameter in einer verschachtelten React-Route verwende, wenn ich mich in /ap...
Aus 2024-04-05 13:48:33
0
1
1475
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage