Wie erstelle ich ein (Bild) Header Logo mit MVC (4)

Question

Ich kämpfe mit einer Razor Syntax mit MVC (4), in der Hoffnung, jemanden zu finden, der mir mit einer netten und funktionierenden Lösung helfen kann.

Ich möchte ein anklickbares Logo (Bild) und den folgenden Code erstellt. Dies funktioniert bis auf zwei Dinge. Ich sehe nicht die Bildanzeige und zweitens, wenn in einem anderen Controller das Routing falsch geht (http4 Fehler).

Dies ist, wie ich es jetzt getan haben:

Razor:

<h1>@Html.ActionLink("siteHeader", "Index", null, new { @class = "site-logo"})</h1> 

ODER

<h1>@Html.ActionLink("siteHeader", "Index", "Home", new { @class = "site-logo"})</h1> 

z.B. wenn sie in einem anderen Controller (. Konto/Warenkorb/etc) und klicken Sie das Logo, kommt es zu einem 404.

CSS:

/Website header/

a.site-logo {  
background: url(images/Solosoft.png) no-repeat top left; 
display: block;  
width: 100px;  
height: 100px;  
text-indent: -9999px; /*hides the link text*/ 
    } 

Dank im Voraus.

Answer 1

Versuchen Sie folgendes:

@Html.ActionLink("siteHeader", "Index", "Home", null, new { @class = "site-logo"}) 

Dies ist:

public static MvcHtmlString ActionLink(
    this HtmlHelper htmlHelper, 
    string linkText, 
    string actionName, 
    string controllerName, 
    Object routeValues, 
    Object htmlAttributes 
) 

-Link: msdn

Answer 2

Ich habe das Problem Ursache!

Theres nichts falsch mit unserer Codierung, die Sache ist eine Klasse Theres, die unser Bild

Theres diese Zeilen in Site.css

.site-title a, .site-title a:hover, .site-title a:active { 
    *background: none;* <=comment this out and the bg will show or remove the .site-title a 
    color: #c8c8c8; 
    outline: none; 
    text-decoration: none; 
} 

hoffen, dass es

gesetzt hat Vorrang vor

Answer 3

Was wizzardz sagte hilft ist richtig. Der Hintergrundstil in der benutzerdefinierten CSS-Datei wird durch Stile in site.css überschrieben.

Versuchen Sie dies, !important - verwendet, um Stile zu priorisieren, die auf der Webseite erscheinen. , Thanx

In Ihrer custom.css Seite

a.site-logo {  
    background: url(images/Solosoft.png) no-repeat top left **!important**; 
    display: block;  
    width: 100px;  
    height: 100px;  
    text-indent: -9999px; /*hides the link text*/ 
} 

Keine Notwendigkeit, irgendetwas in site.css

Ok