Сотни ссылок ведут на другие сайты, некоторые на скачивания файлов в Word, некоторые на PDF-файлы и т.п. Было бы очень полезно информировать посетителей о том, куда они попадут при нажатии на ссылку.
Приведу пример с использованием ссылки на файл формата .pdf
<a href="file.pdf">Ссылка на PDF</a> |
Немного магии CSS:
a[href $='.pdf'] { padding-right: 20px; /* если иконка 16x16 - делаю отступ 4px */ background: url('ico-pdf.png'); } |
Теперь после каждой ссылки на pdf-файл добавляется красивая иконка. Тоже самое можно проделать с остальными вариантами: E-mail = «mailto:», Word = «.doc», Excel = «.xls» и т.д.
Этим методом можно «пометить» ссылку на любой файл, будь-то музыка или видео.
Но бывают случаи, когда не получится указать расширение файла. Например, при добавлении ссылок на всплывающие окна или на другие сайты.
<a class="popup" href="file.html">Ссылка на всплывающее окно</a> |
И опять немного магии CSS:
a[class ~="popup"] { ... } |
Таким образом можно приделать иконку к любой ссылке, просто определив ее класс.