Question

我的整个网站都有一个css文件。例如，在该css文件中，我为所有引用链接定义了以下样式，例如：

a{
   color: #333;
   padding-right: 3px;
   padding-left: 3px;
   text-decoration: underline;
   outline-width: medium;
   outline-style: none;
   outline-color: invert;
}

a:link, a:visited, a:active, a:hover{
   color: #333;
}

因此我网站中的所有链接都具有上述样式，但我的页面中只有三个链接我不想应用此样式，我的意思是，我想忽略它以便不应用，所以如何忽略下面链接的样式？

   <nav id="NavigationMenu">
            <ul id="menu">
                <li>@Html.ActionLink("Home", "Index", "Home")</li>
                <li>@Html.ActionLink("About", "About", "Home")</li>
                <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
            </ul>
    </nav>

更新：

<div id="flagsGroup">
  <div id="flag">
     <a href="@Url.Action("ChangeCulture", "Home", new { lang = "es-ES", returnUrl = this.Request.RawUrl })"><img src="~/images/SpanishFlag.png" alt="Change page language to spanish."/></a>
     <a href="@Url.Action("ChangeCulture", "Home", new { lang = "ca-ES", returnUrl = this.Request.RawUrl })"><img src="~/images/CatalanFlag.png" alt="Change page language to catalan."/></a>
     <a href="@Url.Action("ChangeCulture", "Home", new { lang = "en-GB", returnUrl = this.Request.RawUrl })"><img src="~/images/BritishFlag.png" alt="Change page language to english."/></a>
  </div>
</div>

Answer 1

更具体，并使用默认值覆盖它。

完美无缺。jsFiddle demo here

CSS

#NavigationMenu #menu li > a {
    padding:0px;
    text-decoration: none;
    outline:none;
    color:#000;
}

#NavigationMenu #menu li > a:link, 
#NavigationMenu #menu li > a:visited,
#NavigationMenu #menu li > a:active,
#NavigationMenu #menu li > a:hover{
   color: #000;
}

根据您的更新编辑..

#flagsGroup #flags > a {
    padding: 0px;
    text-decoration: none;
    outline: none;
    color: #000;
}

#flagsGroup #flags > a:link, 
#flagsGroup #flags > a:visited,
#flagsGroup #flags > a:active,
#flagsGroup #flags > a:hover {
    color: #000;
}

Answer 2

您可以使用:not - 选择器

排除这些链接

http://jsfiddle.net/J2rfU/1/

a:not(#menu a) {
   color: red;
   text-decoration: underline;
}

使用此CSS，所有链接都会从菜单中的链接变为红色。

根据您的更新：

a:not(#flag a) {
   color: red;
   text-decoration: underline;
}

Answer 3

你需要覆盖全局样式，只是让它们不适用是不可能的。覆盖它们使用类似这样的东西

#menu a{        
    color: #000;
}

//和悬停等

#menu a:link, #menu a:visited, #menu a:active, #menu a:hover{
    color: #000;
}

Answer 4

如果你生活中有一个标签，你可以写一些像

这样的东西

#menu li a {
    color:red;
}

忽略具体标签的样式

4 个答案: