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

Сообщений: 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;}

09.03.2026 01:10	Гильотина для классиков: Клод доедает физические книги
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	Генератор ИКС, обратных ссылок на сайт

Новые темы	Объявления	Свободное общение
01:00 AI под надзором. Минцифры готовят клеймо для контента 18:07 ИКС Яндекс АПдейт 1 апреля 2026. Обновлён алгоритм расчёта 19:02 Gambling Craft - гемблинг по белому 17:03 LOSPOLLOS.COM - Конвертим по рецепту Хайзенберга. Dating, Mainstream, Binary Options 15:51 Яндекс-ап 20 марта и похороны ChatGPT, Claude и Gemini. Считаем убытки 10:16 Бесплатное расширение для Chrome — проверка ссылок прямо на странице 10:12 Gmail разрешил менять основной адрес - теперь можно убрать старые ники без переноса аккаунта	19:38 Monitex: Мониторинг с кэшбэком 80% в USDT 19:31 Мониторинг обменников Сrypto-scout.io 16:22 Рассылки СМС/SMS, Вайбер/Viber, Ватсап/Whatsapp, Телеграм/Telegram любой тематики по всему миру 13:14 Аккаунты HeadHunter - Продам/верифицирую аккаунты работодателей hh.ru (HeadHunter, HH.RU, ХХ ) 13:14 Продам аккаунты HeadHunter (Верификация на ИП) 11:36 Продам сайт - продукты питания 08:16 PROSMM-SHOP — Надёжный сервис продвижения в социальных сетях	01:50 Точные прогнозы на футбол 23:54 молодильные яблоки и живая вода 04:35 Ставки на супер тренды в спорте 15:49 Огородники 16:25 8 марта: желаю аптайма 99.9% и e-e-a-t без локов 22:45 С юмором по жизни! 15:42 Голландцы влепили Grok по яйцам - теперь нельзя раздевать реальных людей, штраф 100к евро в день