Как сделать кнопку со ссылкой, такую же как кнопка найти?

голоса: 0
Как сделать кнопку со ссылкой, такую же как кнопка найти? Мне нужен код, а куда вставить я сам знаю))

Хочу ссылку на страницу участницы сделать под видом такой кнопки!
| Автор: | Категория: Дизайн сайта

Ответов: 1

Голоса: +1
 
Лучший ответ

Здравствуйте!

Вот так:

<a href="javascript://" id="webo4ka">Ссылка</a>


<style>
#webo4ka {
 padding: 5px 14px;
 border: none;
 color: #fff;
 font: normal 15px 'PT Sans', sans-serif;
 cursor: pointer;
 background: #f85772;
 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #f85772), color-stop(1, #f86296));
 background: -moz-linear-gradient(center bottom, #f85772 0%, #f86296 100%);
 background: -o-linear-gradient(#f86296, #f85772);
 -webkit-border-radius: 3px;
 -moz-border-radius: 3px;
 border-radius: 3px;
 -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
 -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

#webo4ka:hover { 
 background: #fa889b;
 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #fa889b), color-stop(1, #fa93b7));
 background: -moz-linear-gradient(center bottom, #fa889b 0%, #fa93b7 100%);
 background: -o-linear-gradient(#fa93b7, #fa889b);
}
</style>

| Автор:
Это плохой код. Уж извините, но это так! Он слишком длинный. Зачем прописывать все стили заного, если они уже есть у меня для этой кнопки? Но плюсик за старание всё ровно дам :)

Он у вас прописан для кнопок input, а не для ссылок...

Если Вы считаете данный код плохим, то у Вас значит весь код плохой, т.к. я вытащил его из Вашего CSS

Можете просто тогда дописать любой class или id в Вашем css

 

input[type="submit"],
input[type="reset"],
input[type="button"],

.ccilka {
 padding: 14px;
 border: none;
 color: #fff;
 font: normal 15px 'PT Sans', sans-serif;
 cursor: pointer;
 background: #f85772;
 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #f85772), color-stop(1, #f86296));
 background: -moz-linear-gradient(center bottom, #f85772 0%, #f86296 100%);
 background: -o-linear-gradient(#f86296, #f85772);
 -webkit-border-radius: 3px;
 -moz-border-radius: 3px;
 border-radius: 3px;
 -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
 -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
option {

и сама ссылка:

 <a href="javascript://" class="ccilka">Ссылка</a>

...