Tuesday, June 3, 2014

Using @Html.ActionLink as image link

If you need to serve image with the link using Razor, you can use HtmlHelpers like Html.ActionLink() to make it possible, this is how you can do it. First define the style with the image:

a.link_logo {
    background:url(/images/logo.jpg) no-repeat top left;
    width: 355px;
    height: 75px;
    display: block;
    text-indent: -9999px; /* In order to hide the text */
}



Then use the HtmlHelper and add the style:

// --------------------------------
@Html.ActionLink("Home", "Index", "Home", null, null, null, null, new { @class = "link_logo" })


// --------------------------------
@Html.ActionLink("Home", "Index", null, new { @class = "link_logo" })


//---------------------------------

No comments:

Post a Comment