All About ホームページ作成 「別ウインドウで開くリンクにアイコンを付加」 サンプルページ

リンク先を新規ウインドウで開くよう記述されているリンクにだけ、アイコン「新しいウインドウで開く」が表示されています。

※注意※
このサンプルでは「属性セレクタ」と「after疑似要素」を使っているため、Internet Explorerは『Ver.8以降』でないと表示されません。
※「属性セレクタ」はIE7から対応していますが、「after疑似要素」はIE8からの対応です。 IE7でも表示できるようにするには、after疑似要素の代わりにbackground-imageプロパティを使って背景画像として表示させるなどの方法があります。 （IE6でも表示できるようにするには、「属性セレクタ」も使えないため、対象となるa要素にclass属性を付加するなど、HTMLソース側への追記が必要になってしまいます。）

上記で使っているアイコン画像は、newwinicon.gifです。（※必要であればご自由にご活用下さい。加工も可。）

/ 記事に戻る