我正在尝试获取我的导航栏 to look like this .然而,无论我对基本布局代码进行何种更改,文本似乎都不会与屏幕右侧对齐。
我的html代码如下:
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
@if (Session["Logged_In"] == null)
{
<li>@Html.ActionLink("Home", "Index", "OUsers")</li>
<li class="navbar-right">@Html.ActionLink("Create", "Create", "OUsers")</li>
<li class="navbar-right">@Html.ActionLink("Login", "Login", "OUsers")</li>
}
@if (Session["Logged_In"] != null)
{
<li>@Html.ActionLink("Home", "LoggedIndex", "OUsers")</li>
<li>@Html.ActionLink("Delete Account", "DeleteProfile", "OUsers")</li>
<li>@Html.ActionLink("Edit Profile", "EditProfile", "OUsers")</li>
<li style="float:right">@Html.ActionLink("Sign Out", "SignOut", "OUsers")</li>
}
</ul>
</div>
这不是完整的布局代码,但它是我实际编辑过的代码,似乎与文本对齐有关。此外,我的“navbar-right”类仅包含 float: right;
和 text-align: right;
奇怪的是,当我检查网站上的登录和创建操作链接时,应用了“navbar-right”类,但对齐方式没有改变。可能值得注意的是,我尝试将 css 类放在 actionlink 参数中,但没有任何改变,我还尝试了一个新的带有导航栏的分区,但这似乎使登录在 Home actionlink 下对齐,这对我来说也很奇怪。
最佳答案
看来您使用的是 Bootstrap 3。那么这就可以了
<div class="collapse navbar-collapse" id="navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
</div>
关于c# - 如何在 MVC 5 中的 Bootstrap 3 导航中将链接左右对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59610612/