css,css3excelへのリンクを貼りたい場合、pdfへのリンクを貼りたい場合、ユーザビリティを上げるためにもどんなファイルなのかアイコンを入れたい時がありますが、その場合imgタグを使ってませんか?リンク先の拡張子をみてimgタグを打たなくてもcssだけで自動的につけることができます。答えを早く知りたいかたはこちらリンクの右横にアイコンをいれれたら、なんのファイルへのリンクなのかユーザーがわかりやすくなります。PointリンクPdfリンクこんな風にリンクを貼るのaタグの中や右にimgタグを打ってる方はこの続きをぜひ読んでおいてください。属性セレクタを使います。後方一致で指定します。属性セレクタに関してわからない方は過去の記事を参照してください。href="file.pdf">Pdfリンク</a>たったこれだけで、簡単にリンクにアイコンを付与することができます。PointリンクPdfリンク別ウィンドウで開くリンクにも使えますおまけですが、この属性セレクタを用いれば拡張子をみる以外にも特定の属性の値を見て指定をすることができるので、別ウィンドウで立ち上げるリンクにアイコンをつけることも簡単です。target="_blank">別ウィンドウで開くリンク</a>ここで注意しなければならないこととしては、css上の順番です。pdfに関してはブラウザ上で表示するためにtarget指定を同時にすることもあると思います。この場合css上の記述順序を逆にしてしまうとpdfアイコンがblankアイコンに上書きされてしまうので記述順は注意です。60ビューaboutはむすけ自然と動物が大好きなWebクリエイター。front-endが専門領域ですが動物の知識はそれ以上。