Как добавить изображение на навигационную марку в ASP.NET MVC 5 RAZOR

Question

Я пытаюсь asp.net mvc в эти дни, но застрял в начальной фазе. Я хочу разместить изображение вместо имени приложения с заголовком и тегом 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

Вы можете сделать это:

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

Тогда в CSS, есть это:

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

Answer 2

1 вариант: Вы можете сделать все, что в CSS:

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

JsFiddle example - в этом примере изображения 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 вариант: Define your own helper.

Answer 3

Его простой. В MVC-5 это работает.

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

И удостоверьтесь, что логотип размещен в правильной папке.

Answer 4

Robin запросил помощь в замене текста «Я хочу разместить изображение вместо имени приложения с заголовком и тегом alt». с изображением.

Answer 5

Откройте папку приложений MVC, создайте папку под названием «изображения» рядом со всеми другими папками (Model, View, Controller, ...), разместите свой логотип в папке images. Затем откройте View/Home/index.cshtml в вашем визуальном редакторе студии и поместить следующую строку HTML кода внутри верхней <div>:

<div class="jumbotron"> 
    <img src="images/logo.jpg" alt="Games Logo" ALIGN="right" /> 
    <h1>Computer Games Library</h1> 
    <p class="lead">Programmer: Marzieh Farahani</p> 
</div>