класс ссылок с картинкой

Сообщений: 3289 Регистрация: Янв 2011

6 Ноября 2015 18:51

всем привет, возможно ли ссылкам через стили присвоить свою кнопку-картинку без тега <img>?
например:
на сайте имеется контент для скачивания .zip .rar .iso .mp3 и т.д.
для каждого добавлять тег <img> немного муторно, гораздо проще и короче дописать к ссылке свой class=''
движок WP

Код
a.zip {background: url(zip.png) no-repeat} <a class="zip" href=""></a>

з.ы. вроде не балбес, но код выше не работает smile:confused:

Биржа криптовалюты

Отличный хостинг Webhost1

Валентин

Сообщений: 621 Регистрация: Май 2010

6 Ноября 2015 19:27

1. проверить путь к фоновой картинке
2. соответствует ли размер ссылки размеру фоновой картинки (у ссылки должна быть прописана и высота и ширина и , если у ссылки есть текст, то нужно его сдвинуть, чтобы он не закрывал фоновую картинку)

инвестиции

Андрей

Сообщений: 72 Регистрация: Окт 2015

6 Ноября 2015 19:42

Цитата
paltarasych пишет: код выше не работает

Работает _jsfiddle.net/oe41y8c2/

paltarasych

Сообщений: 3289 Регистрация: Янв 2011

6 Ноября 2015 21:15

Андрей, Валентин, благодарю, че то я упустил из виду значит.

буду разбираться.

Валентин

Сообщений: 621 Регистрация: Май 2010

6 Ноября 2015 21:19

покажите в личку пример странички...

paltarasych

Сообщений: 3289 Регистрация: Янв 2011

6 Ноября 2015 22:00

я в ступоре! я понимаю что такой вид должен работать,

Андрей, показал это наглядно. на локалке код не работает

Код

<html>
 <head>
  <meta charset="utf-8">
   <style>

a.zip {background: url(http://www.cy-

pr.com/upload/forum/avatar/b0f/b0f754c8bf7dd090ee79b38b84cd23ae.jpg) no-

repeat;display:block;width:100px;height:100px;} 

  </style>
 </head>
 <body> 

<a class="zip" href=""></a>
 </body>
</html>

проверял на трех браузерах лиса - хром - опера.

Изменено: paltarasych - 6 Ноября 2015 22:02

Валентин

Сообщений: 621 Регистрация: Май 2010

6 Ноября 2015 22:35

плохо скопировал путь картинки smile:)

paltarasych

Сообщений: 3289 Регистрация: Янв 2011

8 Ноября 2015 22:51

Цитата
Валентин пишет: плохо скопировал путь картинки

удивительно, но иногда картинка появляется на html странице, картинки из корня этой же папки работать не хотят!на движке вордпрес прописывание с стилях этих классов и попытке вывода тоже не выдают ничего!
кстати, думал проблема в моем ПК - нет! проверял html страницу на четырех разных браузерах у себя, и на двух ноутбуках - нет картинок! smile:wall:

при просмотре кода элемента гугл выдает следующую ошибку

Код
Failed to load resource: net::ERR_FILE_NOT_FOUND Failed to load resource: the server responded with a status of 403 (Forbidden)

Валентин

Сообщений: 621 Регистрация: Май 2010

8 Ноября 2015 23:29

можно закачать картинку в сам вп и прописать обсолютный путь smile:)

paltarasych

Сообщений: 3289 Регистрация: Янв 2011

#10

9 Ноября 2015 11:51

Цитата
Валентин пишет: можно закачать картинку в сам вп и прописать обсолютный путь

и этот вариант не работает smile:wall:

кстати просто от руки написанная страница с указанием абсолютного пути на работе тоже не пашет!!! браузер хром.
может css3 отказался от этого тега в свойствах ссылок?

Изменено: paltarasych - 9 Ноября 2015 11:52

paltarasych

Сообщений: 3289 Регистрация: Янв 2011

#11

9 Ноября 2015 15:01

в общем решил проблему в WP (на локалке бодаюсь пока)
в стилях прописал путь до папки изображений темы, кнопки поместил туда же

Код
a.zip { background: url(./images/zip.png) center no-repeat;}

Похожие темы:

07.12.2024 13:44	Продвижение в социальных сетях: Вконтакте, Одноклассники, Твиттер, Instagram, YOUTUBE, Facebook, Мой мир.
05.06.2022 16:50	Сокращение ссылок, которое доступно всем
31.12.2021 11:19	Сервис услуг в YouTube, Вконтакте, Instagram, Twitter, Facebook, Одноклассники, Google+
21.04.2021 09:52	Генератор ИКС, обратных ссылок на сайт
29.01.2021 20:08	Бурятские школьники попробовали продать одноклассника через интернет

Читают тему (гостей: 1, пользователей: 0, из них скрытых: 0)

Новые темы	Объявления	Свободное общение
19:55 SEO под нейро 18:04 Нужна помощь советом! 16:56 Webvork - международная товарная СРА сеть с сертифицированными офферами на Европу. 14:47 Dao.AD: Монетизация и покупка Push/Pops/Inpage и Video трафика! 14:23 SharkBoss - партнёрская программа для монетизации ЛЮБЫХ видов трафика (включая спам). 09:44 SEO 2025 - контент, уже не главное. Главное - Конечная цель... 06:06 Яндекс прекращает поддержку технологии Турбо	22:04 KRaKeN или КРаКеН?? Все ССЫЛКИ 2025 ! Доступный Список Рабочих Ссылок и Зеркал Для Безопасного Входа в KRAKEN + Рекомендации 16:08 Expa24.com Обмен Криптовалют. Ввод/Вывод наличные Украина/Северный Кипр/Мир 15:28 Бесплатные виртуальные роутеры от ARB. Лучшее решение для подключения прокси на виртуальных машинах 15:22 BIGPROXY.SHOP - Резидентные Ротационные Backconnect Proxy USA EUROPA MIX [Безлимитный трафик] 14:26 VING.exchange — простой и надежный обмен криптовалют на СБП RUB 12:10 Скрипт обменника валют 11:08 Фриланс-платформа Work24	22:29 Точные прогнозы на футбол 14:58 150+ хакерских поисковых систем и инструментов 17:41 Стряхнуть обыденность - об Агасфере 10:54 Добро пожаловать в цифровой мир... 22:39 Топ-5 способов использовать мобильные прокси для бизнеса: подробный обзор 11:58 Куплю проигрышные букмекерские аккаунты 00:12 Огородники