Maison > interface Web > js tutoriel > Exemple de barre de navigation réactive BootStrap introduction_javascript skills

Exemple de barre de navigation réactive BootStrap introduction_javascript skills

WBOY
Libérer: 2016-05-16 15:01:59
original
2114 Les gens l'ont consulté

Bootstrap, de Twitter, est actuellement le framework front-end le plus populaire. Bootstrap est basé sur HTML, CSS et JAVASCRIPT. Il est simple et flexible, ce qui accélère le développement Web. La barre de navigation réactive vous permet d'afficher différents effets sur différents appareils.

Laissez-moi partager le code avec vous :

<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>
Copier après la connexion

data-toggle=”collapse” Comportement attendu

Exemple de barre de navigation réactive BootStrap introduction_javascript skills
Exemple de barre de navigation réactive BootStrap introduction_javascript skills
Exemple de barre de navigation réactive BootStrap introduction_javascript skills

Le contenu ci-dessus est un exemple de barre de navigation réactive BootStrap introduite par l'éditeur. J'espère qu'il sera utile à tout le monde !

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal