导航栏是垂直的,而不是水平的 [英] navbar is vertical instead of horizontal
本文介绍了导航栏是垂直的,而不是水平的的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
<div id="navigation">
<nav class="navbar navbar-default">
<ul class="nav navbar-nav">
<li class="nav-item"><a class="nav-link" href="/">Home</a></li>
<li class="nav-item"><a class="nav-link" href="/browse">Browse</a></li>
<li class="nav-item"><a class="nav-link" href="/create">Create</a></li>
<li class="nav-item"><a class="nav-link" href="/review">Review</a></li>
<li class="nav-item"><a class="nav-link" href="/help">Help</a></li>
</ul>
<form class="form-inline">
<a href="#" onclick="signOut();">Sign out</a>
<div id="my-signin2">
<!-- google oauth stuff -->
</div>
</form>
</nav>
</div>
为什么它显示的是垂直列表而不是水平列表?
Why does this show a vertical list instead of a horizontal one?
推荐答案
我删除了 navbar-nav
类,该类再次处于水平状态.我最好的猜测是navbar-nav类具有与之关联的某些CSS,这些CSS会覆盖 navbar-default
样式.
I removed the navbar-nav
class and it's horizontal again. My best guess is that the navbar-nav class has some css associated with it that was overwriting the navbar-default
styles.
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
<div id="navigation">
<nav class="navbar navbar-default">
<ul class="nav">
<li class="nav-item"><a class="nav-link" href="/">Home</a></li>
<li class="nav-item"><a class="nav-link" href="/browse">Browse</a></li>
<li class="nav-item"><a class="nav-link" href="/create">Create</a></li>
<li class="nav-item"><a class="nav-link" href="/review">Review</a></li>
<li class="nav-item"><a class="nav-link" href="/help">Help</a></li>
</ul>
<form class="form-inline">
<a href="#" onclick="signOut();">Sign out</a>
<div id="my-signin2">
<!-- google oauth stuff -->
</div>
</form>
</nav>
</div>
这篇关于导航栏是垂直的,而不是水平的的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文