如何阻止应用于所有链接的链接

我有以下css用于使一个链接着色，但它适用于我拥有的所有链接。有什么办法可以制止这种情况吗？如何阻止应用于所有链接的链接

这是我的CSS，这是获得应用于链接：

a:visited { 
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
font-size: 14px; 
font-style: italic; 
font-weight: bold; 
color: #FFF; 
text-decoration: none; 
background-color: #F00; 
display: block; 
border-radius: 5px; 
z-index:10; 
} 

a:link { 
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
font-size: 14px; 
font-style: italic; 
font-weight: bold; 
color: #FFF; 
text-decoration: none; 
background-color:#F00; 
display: block; 
border-radius: 5px; 
z-index:10; 
} 

a:hover { 
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
font-size: 14px; 
font-style: italic; 
font-weight: bold; 
color: #CCC; 
text-decoration: none; 
background-color: #C00; 
display: block; 
border-radius: 5px; 
z-index:10; 
}

这是它想获得应用于链接：

<td><a href="Food.html">Food</a></td>

这是链接，我不不希望它适用于：

<td class="footer"><b><a href="Rides.html">Top Attractions</a></b>

来源

2014-10-09 philip

您可以选择您的a标记href这样的：

的jsfiddle - DEMO

a[href="Food.html"] { 
    color: red; 
}

更新时间：DEMO（与你的代码）

来源

2014-10-09 11:27:48 Anonymous

试试这个

HTML

<td><a href="Food.html" class="colored>Food</a></td>

CSS

.colored{ 
color:red; 
}

来源

2014-10-09 11:28:05 Akshay

有一两件事你可以做，将是给标签的ID /类，然后是指在你的CSS。

来源

2014-10-09 11:28:14 LiamWilson94

我试着添加一个类，但它没有工作 – philip 2014-10-09 12:34:38

您可以将一个类添加到您想要的不同链接并单独设置它。

HTML：

<td class="footer"><b><a href="Rides.html" class="rides">Top Attractions</a></b>

CSS：

a.rides {...}

来源

2014-10-09 11:29:03 codephobia

应用类到要实现链接：

a:link.apply_to_this{ 
    // your styles 
}

：

<a href='food.html' class='apply_to_this'>Food</a>

在你的CSS

然后

来源

2014-10-09 11:29:04 proPhet

您可以添加一个类的链接，您wan't到应用此规则，或者您可以使用此规则：

a:not(.footer):link {...}

来源

2014-10-09 11:29:19 ghorg12110

工作的jsfiddle：demo
我给的链接，你想要的风格类给了这个班级一个风格。

a.food :visited

，而不是一个：拜访

来源

2014-10-09 11:30:18 Nick

而不是阻止它被应用到一个链接，你需要添加一个类额外的CSS将覆盖链接要改变风格，或（尽管这是不好的做法...）在该链接上使用内联样式。

妥善解决：

在你的CSS

.exception {put css here that will override the general link css, using !important to override it ifnecessary}

在HTML

<a href="food.html" class="exception">Content here</a>

快速和肮脏的解决方案

<a href="food.html" style="Your overiding css here">Content</a>

虽然这种方式将起作用，但对于可访问性问题，这是正确的。

来源

2014-10-09 11:33:02 BFWebAdmin

您只需创建一个类，像上面提到或者你可以按照通过你的选择，告诉CSS来应用的链接代码，只将其应用到该链接：这些选择中的链接像我贴在下面：

#mainContainer #footer #etC#etc a:link { 
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
font-size: 14px; 
font-style: italic; 
font-weight: bold; 
color: #FFF; 
text-decoration: none; 
background-color:#F00; 
display: block; 
border-radius: 5px; 
z-index:10; 
}

PS - 内联样式是非常糟糕的做法。它增加了大量额外的代码，这些代码会降低Google，Yahoo，MSN等的排名。更不用说它使代码更难阅读，更笨拙。

来源

2014-10-09 11:40:35 tommydevs

如何阻止应用于所有链接的链接

回答

相关问题