Как сделать кнопку карти...

[IX.]

Недавно мой блог приняли в dmoz ( да и в ЯК кстати тоже ), так вот я спешу поделиться своими мыслями по этому поводу.
Ну и так же дам пару советов, о правильной подготовке сайта к дмозу ( подробнее в статье ).

Пост можно почитать здесь.

А вы есть в дмозе?
Как долго вы туда "попадали"?

[mojwp]

в ЯК бесплатно приняли?

[kuzmi4]

CSS
Псевдокласс :hover - меняет то что надо при наведении, "что то" может быть цвет фона, размер шрифта, картинка и т.д.
Наверное вот это вам нужно http://htmlbook.ru/faq/kak-sdelat-ch...vedenii-na-nee.

[IX.]

Забыл: вот код css, применяемый к кнопке, что в нём поменять?

Код HTML:

.button1{text-decoration:none; text-align:center; 
 padding:2px 41px; 
 border:none; 
  
 font:30px Arial, Helvetica, sans-serif; 
 font-weight:bold; 
 color:#ffffff; 
 background:#E9DA09; 
 -webkit-box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 0px 2px #bababa,  inset 0px 0px 1px #ffffff;  
 box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;  
  
  }.button1:hover{
 padding:2px 41px; 
 border:none; 
  
 font:30px Arial, Helvetica, sans-serif; 
 font-weight:bold; 
 color:#ffffff; 
 background:#C7BB11; 
 -webkit-box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 0px 2px #bababa,  inset 0px 0px 1px #ffffff;  
 box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;  
  
 }.button1:active{
 padding:2px 41px; 
 border:none; 
 font:30px Arial, Helvetica, sans-serif; 
 font-weight:bold; 
 color:#ffffff; 
 background:#E9DA09; 
 -webkit-box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff; 
 -moz-box-shadow: 0px 0px 2px #bababa,  inset 0px 0px 1px #ffffff;  
 box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;  
  
 }

[feuer81]

Как как?
Сделать ее в фотошопе ))

---------- Сообщение добавлено 10:15 ---------- Предыдущее 10:14 ----------

Как как?
Сделать ее в фотошопе ))

p.s. Кстати, если сделать 2 картинки и в CSS прописать разное значение по Y при наведении, то есть атрибуте Hover, то кнопка станет анимированной

[IX.]

Сделать ее в фотошопе ))

Это оффтоп. Код вверху, не знаю, что в нём убрать и что дописать.

[thomas]

IX., вам же написали, что указать вашу картинку в свойстве background. Вы что не видите, где у вас в коде оно написано?

[IX.]

thomas, понял, просто думал, что какой-то код нужно удалить. Посмотрите, пожалуйста, сайт nekrutit.net - часть картинки видно. Как показать всю?

Вот картинка целиком:

[thomas]

IX., ну если у вас такая картинка (то есть вместе с текстом), то проще просто собственно саму картинку вставить в тег <a> и удалить класс button1

Код HTML:

<a class="fancybox" href="#contact_form_pop"><img src="http://nekrutit.net/wp-content/themes/nekrutit16/images/zakaz-neodimovie.png" alt="Оформить заказ" /></a>

или вот первый вариант

Код HTML:

.button1{
  display: inline-block;
  width: 248px;
  height: 94px;
  background: url("http://nekrutit.net/wp-content/themes/nekrutit16/images/zakaz-neodimovie.png") 0 0 no-repeat;
  text-indent: -9999px !important;
}
.button1:hover{

}
.button1:active{
 
}

если при наведении другая картинка предполагается, то соответственно она указывается для :hover.

[IX.]

thomas, благодарю, то, что надо!
Правда, проблема появилась - откройте главную страницу и нажмите на кнопку. Это что, скриншот делается?...
На остальных страницах всё хорошо.

upd. На всех страницах такая проблема... Только что вроде было нормально.