使用CSS标注外部链接的巧妙方法

在一些像维基百科这样的信息类网站上，把外部链接用某种形式标明出来是一种常见的做法。对于浏览者，这能方便的告诉他们将访问一个外部资源。很多网站会在服务端检查外部链接，并在链接上加入`rel=external`属性或`external`类来区别这些链接。但有些情况下你无法这样做或不该这样做。在经过了在网上的一番搜索后，我发现了这个非常高效简洁的标注外部链接的CSS代码：

/* 详细版 */
a[href^="http://"]:not([href*="mysite.com"]),
a[href^="https://"]:not([href*="mysite.com"]),
a[href^="//"]:not([href*="mysite.com"]), {
}
/* 精简版！ */
a[href*="//"]:not([href*="mysite.com"]) {
/* 这里放置外部链接的风格样式，可以使用 :before 或 :after 等任何你想采用的方法！ */
}

这段代码首先是找到链接的开始处，然后是域名排除。比较后只有外部域名被样式选择器捕获。好的技巧方法都应该放到自己的知识库里，有朝一日会用得着的！