如何在ASP.NET MVC 5 RAZOR中将图像添加到navbar-brand

Question

我这几天正在尝试asp.net mvc,但仍处于开始阶段.我想用title和alt标签来替换应用程序名称.请帮我.

谢谢

<div class="navbar-header pull-left">
    <a class="navbar-brand" href="index.html"><img src="img/accomodator-mini.png" title="title" alt="additional title" /></a>
</div>

以这种方式如何做到:

 @Html.ActionLink("Application name", "Index", "Home", null, new { @class = "navbar-brand" })

我很困惑如何在应用程序名称的位置显示图像

Answer 1

1选项: 您可以在css中执行所有操作:

.navbar-brand{
    background: url(http://placehold.it/350x150) no-repeat;
    background-size: 40px 40px;
    height:40px;
    margin:5px;
    width:40px;
}

JsFiddle示例 - 在此示例中,图像为350x150像素.使用background-size属性,您可以调整图像大小.

2选项:

<a href="@Url.Action("Index", "Home")" class="navbar-brand">
    <img src="img/accomodator-mini.png" title="title" alt="additional title" />
</a>

3选项: 定义自己的帮助器.

Answer 2

这很简单.在MVC-5中,这是有效的.

<a href="@Url.Action("Index", "Home")" class="navbar-brand">
  <img src="~/Images/logo.png" title="title" alt="additional title" />
</a>

并确保您的徽标放在正确的文件夹中.

Answer 3

你可以这样做：

@Html.ActionLink("Application name", "Index", "Home", null, new { @class = "navbar-brand" })

然后在CSS中，有这样的：

.navbar-brand {
    background-image: url(img/accomodator-mini.png);
}