Heim  >  Artikel  >  Web-Frontend  >  Beispiel für eine reaktionsfähige BootStrap-Navigationsleiste: Einführung_Javascript-Kenntnisse

Beispiel für eine reaktionsfähige BootStrap-Navigationsleiste: Einführung_Javascript-Kenntnisse

WBOY
WBOYOriginal
2016-05-16 15:01:592091Durchsuche

Bootstrap von Twitter ist derzeit das beliebteste Frontend-Framework. Bootstrap basiert auf HTML, CSS und JAVASCRIPT. Es ist einfach und flexibel und beschleunigt die Webentwicklung. Mit der reaktionsfähigen Navigationsleiste können Sie verschiedene Effekte auf verschiedenen Geräten anzeigen.

Lassen Sie mich den Code mit Ihnen teilen:

<header role="banner">
<nav role="navigation" class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">Bootstrappin'</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="index.html">Home</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Team</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container -->
</nav>
</header>

data-toggle=“collapse“ Erwartetes Verhalten

Beispiel für eine reaktionsfähige BootStrap-Navigationsleiste: Einführung_Javascript-Kenntnisse
Beispiel für eine reaktionsfähige BootStrap-Navigationsleiste: Einführung_Javascript-Kenntnisse
Beispiel für eine reaktionsfähige BootStrap-Navigationsleiste: Einführung_Javascript-Kenntnisse

Der obige Inhalt ist ein Beispiel für die vom Herausgeber eingeführte responsive Navigationsleiste von BootStrap. Ich hoffe, dass er für alle hilfreich ist!

Stellungnahme:
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