стилизация ссылок сайта для определенных форматов файлов
стилизация ссылок сайта для определенных форматов файлов-дает определить пользователю вашего сайта визуально определить в каком формате предоставлен такой файл
Секция для адресов сайтов в которых лежат данные файлы
В ксс
Секция для адресов сайтов в которых лежат данные файлы
Код
<section class="links">
<a href="http://site.ru/file.rar">Под ссылкой файл c форматом .rar</a>
<a href="http://site.ru/file.zip">Под ссылкой файл c форматом .zip</a>
<a href="http://site.ru/file.jpg">Под ссылкой файл c форматом .jpg</a>
<a href="http://site.ru/file.pdf">Под ссылкой файл c форматом .pd</a>
<a href="http://site.ru/file.doc">Под ссылкой файл c форматом .doc</a>
<a href="http://site.ru/file.txt">Под ссылкой файл c форматом .txt</a>
<a href="http://site.ru/file.xml">Под ссылкой файл c форматом .xml</a>
</section>
<a href="http://site.ru/file.rar">Под ссылкой файл c форматом .rar</a>
<a href="http://site.ru/file.zip">Под ссылкой файл c форматом .zip</a>
<a href="http://site.ru/file.jpg">Под ссылкой файл c форматом .jpg</a>
<a href="http://site.ru/file.pdf">Под ссылкой файл c форматом .pd</a>
<a href="http://site.ru/file.doc">Под ссылкой файл c форматом .doc</a>
<a href="http://site.ru/file.txt">Под ссылкой файл c форматом .txt</a>
<a href="http://site.ru/file.xml">Под ссылкой файл c форматом .xml</a>
</section>
В ксс
Код
a[href$=".rar"], /* rar ссылка */
a[href$=".zip"], /* zip ссылка */
a[href$=".jpg"], /* jpg ссылка */
a[href$=".pdf"], /* pdf ссылка */
a[href$=".doc"], /* doc ссылка */
a[href$=".txt"], /* txt ссылка */
a[href$=".xml"] /* xml ссылка */
{
padding-left: 22px; /* Отступ от ссылки слева */
}
a[href$=".rar"] { /* Фоновая иконка для файла rar */
background: url('../img/file-rar.png') left center no-repeat;
}
a[href$=".zip"] { /* Фоновая иконка для файла zip */
background: url('../img/file-zip.png') left center no-repeat;
}
a[href$=".jpg"] { /* Фоновая иконка для файла jpg */
background: url('../img/file-jpg.png') left center no-repeat;
}
a[href$=".pdf"] { /* Фоновая иконка для файла pdf */
background: url('../img/file-pdf.png') left center no-repeat;
}
a[href$=".doc"] { /* Фоновая иконка для файла doc */
background: url('../img/file-doc.png') left center no-repeat;
}
a[href$=".txt"] { /* Фоновая иконка для файла txt */
background: url('../img/file-txt.png') left center no-repeat;
}
a[href$=".xml"] { /* Фоновая иконка для файла xml */
background: url('../img/file-xml.png') left center no-repeat;
}
a[href$=".zip"], /* zip ссылка */
a[href$=".jpg"], /* jpg ссылка */
a[href$=".pdf"], /* pdf ссылка */
a[href$=".doc"], /* doc ссылка */
a[href$=".txt"], /* txt ссылка */
a[href$=".xml"] /* xml ссылка */
{
padding-left: 22px; /* Отступ от ссылки слева */
}
a[href$=".rar"] { /* Фоновая иконка для файла rar */
background: url('../img/file-rar.png') left center no-repeat;
}
a[href$=".zip"] { /* Фоновая иконка для файла zip */
background: url('../img/file-zip.png') left center no-repeat;
}
a[href$=".jpg"] { /* Фоновая иконка для файла jpg */
background: url('../img/file-jpg.png') left center no-repeat;
}
a[href$=".pdf"] { /* Фоновая иконка для файла pdf */
background: url('../img/file-pdf.png') left center no-repeat;
}
a[href$=".doc"] { /* Фоновая иконка для файла doc */
background: url('../img/file-doc.png') left center no-repeat;
}
a[href$=".txt"] { /* Фоновая иконка для файла txt */
background: url('../img/file-txt.png') left center no-repeat;
}
a[href$=".xml"] { /* Фоновая иконка для файла xml */
background: url('../img/file-xml.png') left center no-repeat;
}
Файлы для скачивания отсутствуют.
Поблагодарить автора
Автор: Turbo
Комментарии (0)