经常在网站上看到,某些网站外链会在后面显示一个弹出的箭头,提醒用户这个链接非本站链接,这样的效果用正则可以实现,今天就用 CSS3 的选择器来实现。
网站外部链接样式是一种常见的做法,尤其在大多数信息网站比如百度百科等。 作为一个用户,让你什么时候被链接到另一个站外的网页。 许多网站都在服务器端进行检查的外部链接,添加一个 rel=external 的属性值或 external 类的外部链接。 在某些情况下是可行的。 那么用 CSS3 的选择器也可以这么做,请看下面的代码:
- a[href^="http://"]:not([href*="cdsy.xyz"]),
- a[href^="https://"]:not([href*="cdsy.xyz"]),
- a[href^="//"]:not([href*="cdsy.xyz"]){
- /* external link styles
- use :before or :after if you want! */
- }
首先你要从链接开始,然后限定域名。 内部链接和外部链接的习惯习惯匹配的匹配比较。 有用的片段和一些能够让你在图书馆的情况下你需要它。
例如如果有一个链接我的网站
- http://external.com/?referer=mysite.com
你可以添加任何引用模式你使用另一个模式匹配:
- a[href*="?referer"] {
- /* external styles */
- }