CSS - 根据其“rel”属性设置链接样式？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5608808/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS - style a link based on its "rel" attribute?
提问by Alex
<a href="http://google.com" rel="external"> LINK </a>
is it possible to add css rules for rel="external" ?
是否可以为 rel="external" 添加 css 规则？
回答by unor
Felix Kling and thirtydot suggested to use the [att=val]attribute selector (a[rel="external"]). Butthis will only work if externalis the onlyrelvalue.
Felix Kling 和三十多点建议使用[att=val]属性选择器 ( a[rel="external"])。但这只有在external是唯一rel值时才有效。
If you want to style links that could have 1 or more relvalues, you should use the [att~=val]attribute selector:
如果要设置可能具有 1 个或多个rel值的链接的样式，则应使用[att~=val]属性选择器：
a[rel~="external"](note the tildecharacter)
a[rel~="external"]（注意波浪号字符）
An example for such a link could be:
这种链接的一个例子可能是：
<a href="http://google.com" rel="external nofollow">LINK</a>
See http://www.w3.org/TR/css3-selectors/#attribute-representationfor the specification.
有关规范，请参阅http://www.w3.org/TR/css3-selectors/#attribute-representation。
回答by Felix Kling
It is possible with the attribute selector:
可以使用属性选择器：
a[rel=external] {
}
Note:This is selector is not supported in IE6.
回答by thirtydot
Use the attribute selector:
使用属性选择器：
a[rel="external"] {
color: red
}
http://jsfiddle.net/thirtydot/yUmJk/
http://jsfiddle.net/thirtydot/yUmJk/
Works in all modern browsers, and IE7+
适用于所有现代浏览器和 IE7+
回答by K-Gun
Possible with *.
可能与*.
// i.e: <a rel="nofollow external foo">
a[rel*="external"] { color:red; }
// you can add target attribute to open them in a new window
so.dom("a[rel*='external']").setAttr("target", "_blank");
Links:
http://github.com/qeremy/so
http://css-tricks.com/attribute-selectors/
http://www.vanseodesign.com/css/attribute-selectors/
链接：
http: //github.com/qeremy/so
http://css-tricks.com/attribute-selectors/
http://www.vanseodesign.com/css/attribute-selectors/
