web-dev-qa-db-fra.com

Rasoir ASP.NET MVC3 - style Html.ActionLink

J'essaie de définir le style d'un lien d'action comme suit:

  <text><p>Signed in as @Html.ActionLink(Context.User.Identity.Name,"Index",new { Controller="Account", @style="text-transform:capitalize;" })</p>

Je m'attends à ce que cela soit rendu

<p>Signed in as <a href="Index" style="text-transform:capitalize;">MyName</a></p>

Cependant, ce qui est généré est

<p>Signed in as <a href="/Account?style=text-transform%3Acapitalize%3B">MyName</a></p>

avec le style ajouté à l'url à la place. Qu'est-ce que je fais mal?

cssasp.net-mvc-3razor
33
3Dave

Voici la signature.

public static string ActionLink(this HtmlHelper htmlHelper, 
                                string linkText,
                                string actionName,
                                string controllerName,
                                object values, 
                                object htmlAttributes)

Ce que vous faites, c'est mélanger le values et le htmlAttributes ensemble. values sont pour le routage d'URL.

Vous voudrez peut-être faire cela.

@Html.ActionLink(Context.User.Identity.Name, "Index", "Account", null, 
     new { @style="text-transform:capitalize;" });
92
Daniel A. White

échantillon VB:

 @Html.ActionLink("Home", "Index", Nothing, New With {.style = "font-weight:bold;", .class = "someClass"})

Exemple Css:

.someClass
{
    color: Green !important;
}

Dans mon cas, j'ai trouvé que j'avais besoin de l'attribut! Important pour surfer sur le site.css a: link css class

8
Ed DeGagne

Relancer une ancienne question car elle semble apparaître en haut des résultats de recherche.

Je voulais conserver les effets de transition tout en étant en mesure de styliser le lien d'action, j'ai donc proposé cette solution.

  1. J'ai encapsulé le lien d'action avec un div qui contiendrait le style parent:
<div class="parent-style-one">
      @Html.ActionLink("Homepage", "Home", "Home")
</div>
  1. Ensuite, je crée le CSS pour le div, ce sera le CSS parent et sera hérité par les éléments enfants tels que le lien d'action.
  .parent-style-one {
     /* your styles here */
  }
  1. Parce que tout un lien d'action est, est un élément lorsqu'il est décomposé en html, il vous suffit donc de cibler cet élément dans votre sélection css:
  .parent-style-one a {
     text-decoration: none;
  }
  1. Pour les effets de transition, j'ai fait ceci:
  .parent-style-one a:hover {
        text-decoration: underline;
        -webkit-transition-duration: 1.1s; /* Safari */
        transition-duration: 1.1s;         
  }

De cette façon, je ne cible que les éléments enfants de la div dans ce cas, le lien d'action et je peux toujours appliquer des effets de transition.

3
Tahir Khalid