Question

我是ASP.NET MVC的初学者，在默认项目模板中我尝试使用公司名称在 navbar 中添加徽标，我已成功添加了带有公司名称的徽标。但是，徽标和公司名称都不在同一行。我试图内联它。我花了很多时间，但我找不到解决方案。我的输出＆amp;代码如下。

输出：

代码：

<div class="navbar navbar-inverse navbar-fixed-top">
        <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 href="/Home/Index" class="navbar-brand"> <img src="~/Content/images/logo.png" alt="Company logo" height="100"/> </a>
                @Html.ActionLink("Contact Lenses", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li>@Html.ActionLink("About", "About", "Home")</li>
                    <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
                </ul>
                @Html.Partial("_LoginPartial")
            </div>
        </div>
    </div>

请告诉我，我该如何内联？

Answer 1

您只需要更改导航栏的高度和边距顶部。

我在您的Action链接中添加了一个类名companyName，并添加了css string tryVal; if (items.TryGetValue("OneKey", out tryVal)) { // item with key exists so you can use the tryVal }。 <{1}}类的margin-top值也相同。

margin-top

我将徽标高度更改为50。

注意：我查看了一些其他徽标图片。我认为这比你的徽标大小略大。这就是为什么我将高度更改为50，但您可以按照自己的意愿保留它，然后您需要相应地设置navbar-nav和@Html.ActionLink("Contact Lenses", "Index", "Home", new { area = "" }, new { @class = "navbar-brand companyName"}) .companyName, .navbar-nav{ margin-top: 15px !important; }的margin-top值。然后将companyName设置为锚标记，如下图。

navbar-nav

我测试了这段代码。按预期工作。希望它有所帮助：）

导航栏中的内联徽标和公司名称

1 个答案: