如何使用MVC创建(图像)标题徽标(4)

时间:2012-10-02 12:55:50

标签: asp.net-mvc razor header actionlink graphical-logo

我正在努力使用带有MVC(4)的Razor语法,希望找到一个可以帮助我找到一个好的工作解决方案的人。

我想要一个可点击的徽标(图像)并创建以下代码。除了两件事之外,这有效。我没有看到图像显示,其次,在其他控制器中,路由出错(http4错误)。

这就是我现在的表现:

剃刀:

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

OR

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

e.g。当在另一个控制器(account / shoppingcart / etc。)中并点击徽标时,会产生404.

CSS:

/ Site HeaderLogo /

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*/ 
  } 

提前致谢。

3 个答案:

答案 0 :(得分:2)

试试这个:

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

这是:

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

链接:msdn

答案 1 :(得分:1)

我遇到了问题原因!

我们的编码没有错,事情就是一个覆盖我们图像集的类

这是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;
}

希望有所帮助

答案 2 :(得分:0)

wizzardz说的是正确的。自定义css文件中的背景样式被site.css中的样式覆盖。

试试这个,!important - 用于优先考虑在网页中显示的样式。

在custom.css页面中,

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*/ 
} 

无需更改site.css中的任何内容