如何在html动作链接中插入图像? asp.net mvc

时间:2022-11-30 22:42:45

I have navigation and many link on my webproject from html action links. They are ugly with underline. I would like to insert some image with name or play with styles of action link. Is it possible? How to do that?

我在html操作链接的webproject上有导航和许多链接。它们很难看下划线。我想插入一些带有名字的图像或玩动作风格链接。可能吗?怎么做?

Thanks and take care, Ragims

感谢并保重,Ragims

5 个解决方案

#1


17  

You could use css to remove the underlines or place a backgroundimage, otherwise you could also just create the link like so:

您可以使用css删除下划线或放置backgroundimage,否则您也可以像这样创建链接:

<a href="<%: Url.Action("Action", "Controller")%>"><img src="yourimg.jpg" /></a>

#2


2  

Html.ActionLink and Url.Action return the same URL. The difference is that the first creates an HTML element while the second returns just the URL to that action.

Html.ActionLink和Url.Action返回相同的URL。不同之处在于,第一个创建HTML元素,而第二个返回该操作的URL。

Another option is to use Url.RouteUrl or Html.RouteLink to create a link based off your route (to an action) instead of directly to an action.

另一个选择是使用Url.RouteUrl或Html.RouteLink创建一个基于您的路线(到一个动作)的链接,而不是直接创建一个动作。

#3


0  

One solution is to create an HtmlHelper extension method for creating an image-specific action link. A detailed tutorial can be found here.

一种解决方案是创建一个HtmlHelper扩展方法,用于创建特定于图像的操作链接。可在此处找到详细的教程。

#4


0  

If You are on MVC 3-4 with razor view engine then this may help you-

如果您使用剃刀视图引擎进入MVC 3-4,那么这可能对您有所帮助 -

@Html.ActionLink("your link Name", "Action Method", "Controller", 
        new { style = "background-image:url('.././Images/imageyouwanttoshow.png')" },null)

#5


0  

Instead of using @Html.ActionLink("linkname","action","controller") you can use following

您可以使用以下内容,而不是使用@ Html.ActionLink(“linkname”,“action”,“controller”)

<a href='@Url.Action("action", "controller")'>
<img src='@Url.Content("~/images/imageName.png")' />

"images" is my folder for storing the images. @Url.Content() is to know the path. You can pass your action and the controller for that action to @Url.Action(). @Url.Action() works similar to the @Html.ActionLink(). Now your link will get replaced by the image.

“images”是我存储图像的文件夹。 @ Url.Content()是知道路径的。您可以将操作和该操作的控制器传递给@ Url.Action()。 @ Url.Action()的工作方式类似于@ Html.ActionLink()。现在您的链接将被图像替换。

#1


17  

You could use css to remove the underlines or place a backgroundimage, otherwise you could also just create the link like so:

您可以使用css删除下划线或放置backgroundimage,否则您也可以像这样创建链接:

<a href="<%: Url.Action("Action", "Controller")%>"><img src="yourimg.jpg" /></a>

#2


2  

Html.ActionLink and Url.Action return the same URL. The difference is that the first creates an HTML element while the second returns just the URL to that action.

Html.ActionLink和Url.Action返回相同的URL。不同之处在于,第一个创建HTML元素,而第二个返回该操作的URL。

Another option is to use Url.RouteUrl or Html.RouteLink to create a link based off your route (to an action) instead of directly to an action.

另一个选择是使用Url.RouteUrl或Html.RouteLink创建一个基于您的路线(到一个动作)的链接,而不是直接创建一个动作。

#3


0  

One solution is to create an HtmlHelper extension method for creating an image-specific action link. A detailed tutorial can be found here.

一种解决方案是创建一个HtmlHelper扩展方法,用于创建特定于图像的操作链接。可在此处找到详细的教程。

#4


0  

If You are on MVC 3-4 with razor view engine then this may help you-

如果您使用剃刀视图引擎进入MVC 3-4,那么这可能对您有所帮助 -

@Html.ActionLink("your link Name", "Action Method", "Controller", 
        new { style = "background-image:url('.././Images/imageyouwanttoshow.png')" },null)

#5


0  

Instead of using @Html.ActionLink("linkname","action","controller") you can use following

您可以使用以下内容,而不是使用@ Html.ActionLink(“linkname”,“action”,“controller”)

<a href='@Url.Action("action", "controller")'>
<img src='@Url.Content("~/images/imageName.png")' />

"images" is my folder for storing the images. @Url.Content() is to know the path. You can pass your action and the controller for that action to @Url.Action(). @Url.Action() works similar to the @Html.ActionLink(). Now your link will get replaced by the image.

“images”是我存储图像的文件夹。 @ Url.Content()是知道路径的。您可以将操作和该操作的控制器传递给@ Url.Action()。 @ Url.Action()的工作方式类似于@ Html.ActionLink()。现在您的链接将被图像替换。