Bootstrap barre de navigation apparaît comme vertical liste...?
Je suis donc à la suite d'un tutoriel en ligne (http://www.sitepoint.com/twitter-bootstrap-tutorial-handling-complex-designs/) et suivants du code exactement, mais pour une raison quelconque, ma barre de navigation n'apparaît pas la façon dont il devrait être. Mon ami (qui est plus expérimenté avec web dev) a pris un rapide coup d'oeil au code et ne pouvais pas comprendre ce qui n'allait pas. Donc je pensais que je poste mon problème ici.
Je vais aussi vous montrer mon répertoire de travail (juste au cas où vous vous demandez si les fichiers sont tous dans le même répertoire):
Voici le code au cas où vous voulez essayer vous-même
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My bootstrap</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
</head>
<body>
<div class="container">
<h1><a href="#">Bootstrap Site</a></h1>
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<ul class="nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Projects</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Downloads</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</div>
</div>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="js/bootstrap.js"></script>
</body>
qui de démarrage de la version utilisez-vous?
OriginalL'auteur FateNuller | 2014-02-22
Vous devez vous connecter pour publier un commentaire.
Je suis considère que vous utilisez la dernière version de Bootstrap.
Vous devez ajouter
navbar-default
à votre<div class="navbar">
etnavbar-nav
à votre<ul class="nav">
.Qui vous donne le balisage suivant.
Exemple De Travail
Pour de futurs problèmes, essayez de lire le officiel Bootstrap Docs avant de la poser ici. Ils ont tout expliqué très détaillé.
BT barre de navigation
Je suppose que ton problème est, que le sitepoint tutoriel utilise une ancienne Version Bootstrap, que celui que vous avez téléchargé et utilisé.
Comment avez-vous résoudre ce problème? im face à ce courant maintenant..
L'homme je ne peux pas me souviens même pas pense que j'ai juste effacé tout et fait quelque chose d'autre
OriginalL'auteur Sebsemillia
Dans mon cas, j'ai essayé quelques codes que j'ai trouvé sur internet basé sur Bootstrap version 3 mais mon application a été basé sur bootstrap version 4. Il existe d'importantes différences entre les deux versions (voir ici).
Le code suivant basé sur la v4 fonctionne pour moi :
La documentation officielle peut être trouvé ici.
OriginalL'auteur Malick
J'ai eu un problème similaire avec bootstrap v4. Les réponses précédentes code a bien fonctionné pour moi mais je voulais juste préciser que la partie qui a fait la verticale de la barre de navigation horizontale a été d'utiliser navbar-expansion-lg dans les principaux balise div.
Changer le lg vers un autre format (md, sm ou xs) est également utile en fonction de votre écran de dimensionnement des préférences.
Espère que cette aide
OriginalL'auteur Michael Morrison
Si vous voulez que votre barre de navigation pour être toujours à l'horizontale, il suffit de faire comme ceci:
À l'aide de
navbar-expand-lg|md|sm
fera toujours casser à un certain point à la position verticale.OriginalL'auteur divHelper11