リンクを見ただけでは、リンクから開く画面が同じ画面に表示されるのか、別のウィンドウで表示されるのかわかりません。なので、以下のように別ウィンドウで表示される時はアイコンが表示されていると親切ですね。
このページに遷移するリンク:当サイトのトップページ
別ウィンドウに遷移するリンク:当サイトのトップページ
これはCSSで自動で表示させることが可能です。
サンプル
例)targetが"_blank"のリンクの場合、アイコンを表示する
1 2 3 4 |
a[target="_blank"]:after{ content:url('target.png'); /* 表示するアイコンを指定 */ margin:0px 5px; /* 5pxぐらい離した方が見栄えがよい */ } |
1 |
<a href="https://pasomaki.com" target="_blank">当サイトのトップページ</a> |
(結果)
当サイトのトップページ備考
- アイコンはフリー素材サイトなどからダウンロードするなど、自前で用意してください。
コメント