【CSS】リンクを別窓で開くタグには別窓表示のiconを表示させる【属性セレクタ】

リンクテスト

• 同窓
• 別窓

コード

a{
   &[target="_blank"]:after{
        content:' \009'; //はてなブログ用iconName
        font-family: blogicon; //はてなブログ用
  }
}

a[target=_blank]:after{
  content:' \009';
 font-family: blogicon; 
}

<a href="#" target="_blank">別まど</a>

結果

別まど

notつけてはてなブログ以外という書き方もできる

a:not([href*="hatenablog.com"]):after{
  content:' \009';
 font-family: blogicon; 
}

<a href="hatenablog.com">はてなブログ</a>
<a href="https://www.google.com/">その他</a>

はてなブログ
その他

※ただし#の内部リンクも全てついてしまうので、非推奨。