Кнопки .png вместо текстовых ссылок

Как реализовать?

#1 25 ноября 2012 в 17:18
Все здрасьте. В общем как можно сделать кнопки .png вместо текстовых ссылок
На скринах пример
Иллюстрация
Иллюстрация
#2 25 ноября 2012 в 17:52
так стилями лучше задайте, благо CSS3 это все позволяет делать вплоть до использования спец.шрифтов
#3 25 ноября 2012 в 18:02
Т.е. в CSS прописать ссылку на изображения или CSS переменными что-то подобное реализовывать?
#4 25 ноября 2012 в 18:06
да, ссылку на изображение
#5 25 ноября 2012 в 18:15
Спасибо, буду делать так.
Думал может есть способ проще. Пытался при конструировании формы вместо "Ссылка (#1)" прописать адрес картинки через <img>, но при сохранении пропадает вообще все. А было бы так удобно если было бы так.
#6 25 ноября 2012 в 18:19
лучше делать всегда через CSS? если картинки не несут смысловой нагрузки как картинки
#7 25 ноября 2012 в 18:23

лучше делать всегда через CSS? если картинки не несут смысловой нагрузки как картинки

yury
Спасибо за совет
#8 25 ноября 2012 в 23:02
если вам нужно чтобы картинки были статичными. т.е не менялись при наведение можно сделать через

  1. <a><img src="link.."></a>
если нужно чтобы были динамичные, т.е МЕНЯЛИСЬ при наведение

  1. <a><span id="link1">скачать (#1)</span>
и в стилях задать в соответствии с вашими параметрами что-то подобное:

  1.  
  2. #link1 { background: url('/images/btn_download.jpg'); background-position: x y ; }
  3. #link1:hover {background-position: x y ;}
  4.  
при этом необходимл чтобы "btn_download.jpg" было "склееным" изображением кнопки


по поводу css3 не всё на данный момент держит его, поэтому лучше и надежнее фоном, и даже проще;) так как на порядок больше стилей будет определено для подобных кнопок;).
#9 25 ноября 2012 в 23:39

при этом необходимл чтобы "btn_download.jpg" было "склееным" изображением кнопки

kir
можно и две картинки btn_download.jpg и btn_download_hover.jpg)

по поводу css3 не всё на данный момент держит его, поэтому лучше и надежнее фоном, и даже проще;)

kir
Так вы и привели пример указания фона с помощью css) Кстати, а что сща не поддерживает css3 на что стоит обращать внимание? Да и по сути раз уж установили инстант то вообще некорректное предупреждение — тут все на css3))
#10 26 ноября 2012 в 04:38

можно и две картинки btn_download.jpg и btn_download_hover.jpg)

pivua)

а потом появляются типичные проблемы, типо первый раз навел и на месте пустота на некоторое время. ;)

Да и по сути раз уж установили инстант то вообще некорректное предупреждение — тут все на css3))

shockдумаю тут комментарии излишне

Так вы и привели пример указания фона с помощью css)

суть моей фразы заключалась в: создание таких кнопок на чистом css3
#11 28 ноября 2012 в 15:07
kir, благодарю за подробную инструкцию
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.