PDFファイル等へのリンクにマークを付ける
CaminoやFirefox等のスタイルシートの属性セレクタに対応したブラウザで、ユーザースタイルシートを利用して、PDF等へのリンクにアイコンを付加してわかりやすくします。
方法
以下のコードをコピーして、ユーザースタイルシートに設定して下さい。
リンクにマウスカーソルを載せると、次のようなアイコンを表示します。
- PDF
- EXE
- 主な圧縮ファイル
- 新規ウインド
/*リンク先の種類によってマークを表示する*/
/*PDFへのリンク*/
a[href$=".pdf"]:not([href^="/search?"]):hover:after {
content :url("data:image/gif;base64,R0lGODlhIAAQALMPAP//N3h4AFtbAP//Q6mpAP//EuPjAP//dfNRUREREfeDg90AAN3d3f//AAAAAP///yH5BAEAAA8ALAAAAAAgABAAAASh8ElHq3Uy682fY2AIJgvWnd51MWSJds4iz/OX3MnLxTT9haaDcEg8DCYqiwgjlA0GTqisoEmIFAoRwyGEFhbfMLhgMGSsIQVC6xgAvo1FfD4zEM5XRBZYKMTldHN2AXghemtAZQYLioyOgwKFDFiTelgYBAQLmZqbmgQBkYVqWFgIpyahAqusrRsfpFogJjocCWqIsrS1VaeyQLy2SRfBEhEAOw==");
}
/*EXEへのリンク*/
a[href$=".exe"]:hover:after {
content :url("data:image/gif;base64,R0lGODlhIAAQALMPAFOY/wxs/OEmJg4gO////5mZmYy6/wA9mQClAAFb4ubn6P/MAP8AAAAz/wAAAP///yH5BAEAAA8ALAAAAAAgABAAAASk8MlJq72YFsddyaDFCQ4yOEN4cc+QOgxTIoijZiws0/Vk/MCgAUCQxB5H3az3+CmeAEU0+gxIBIyHQPDodHqAsCJAHpsDiTQl6Wg4FgtWmKpIBMb35+HQteUabnBxD2R3aWVlCXt8AQ2EVm2BcDaHdWl1mIoHKROAXYBvkxJ7TwoHpqhPnJ6eXhyDoy6ysy4KEictLwMfDwW4Nys2wMO8w8bHGREAOw==");
}
/*主な圧縮ファイル*/
a[href$=".zip"]:hover:after,
a[href$=".lzh"]:hover:after,
a[href$=".sit"]:hover:after,
a[href$=".bin"]:hover:after,
a[href$=".hex"]:hover:after,
a[href$=".gz"]:hover:after,
a[href$=".dmg"]:hover:after {
content :url("data:image/gif;base64,R0lGODlhIAAQALMPAI/G/1Sp/9Lo/3C3/6/X/+32/0r/qBpiqw84Yoz/zzib/wD7ZiOE5SeS////AP///yH5BAEAAA8ALAAAAAAgABAAAAS28MlkapI4680frUYnjhJ4kSQQBAPxnWgHAEVhLHi+wNLs/4BBQBIQ1AQ3He8xczhXAQc0oHgUBVgkzkAYYoJRhcIhJosbDIYim61gqxjhuNFw0O109GEtUE3/AA9neIR5DAcICgRdRjVHBAJdD2kMDmmWlZSIiTMDBZGLiwNBAxIHB04Op6ipCAgPDaSgBD6jAYESrrq7uhINQgC0PwPEAQQxGQoBDcKkxcvIGQB51NXH0djZDxEAOw==");
}
/*新規ウインド*/
a[target="_blank"]:hover:after,
a[_base_target="_blank"]:hover:after,
a[href^="javascript"]:hover:after {
content :url("data:image/gif;base64,R0lGODlhDAAMAKIHANfXzcfhpf//+zAwMCgoKP///wAAAP///yH5BAEAAAcALAAAAAAMAAwAAAM2SLp8RyDKSBwZJutNihEBKIhGZ4QoWnpD67arUcz0IJQYXQclIOuFAU9heL0Mjs8pEIIlN9AEADs=");
}