Здравствуйте!
Подскажите, пожалуйста, как можно представить кнопку в "шапке" форума, используя CSS взятую из сайта https://css-tricks.com/examples/ButtonMaker/#
?
Кнопка с собственным оформлением
Страница: 1
Сообщений 1 страница 9 из 9
Поделиться1Вс, 9 Авг 2020 19:22:04
Поделиться2Вс, 9 Авг 2020 19:31:01
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51112
- Уважение: +15195
- Позитив: +11564
- Последний визит:
Сегодня 09:36:05
LandWaterSun
По моему такая вставка:
<div id="button-box">
<a href="#" class="button" style="top: 236px; left: 199px;">View the CSS</a>
</div>
Поделиться3Вс, 9 Авг 2020 20:17:43
Получилось следующее (см. http://landwatersun.ru/):
Код:
<div style="position:absolute; margin-top:15px; margin-left: 5px;" >
<a href="http://landwatersun.ru/pages/consult#title">
<style type="text/css">button.new {
border-top: 1px solid #96d1f8;
background: #65a9d7;
background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
background: -moz-linear-gradient(top, #3e779d, #65a9d7);
background: -ms-linear-gradient(top, #3e779d, #65a9d7);
background: -o-linear-gradient(top, #3e779d, #65a9d7);
padding: 11px 21px;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
box-shadow: rgba(0,0,0,1) 0 1px 0;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: white;
font-size: 21px;
font-family: Georgia, serif;
text-decoration: none;
vertical-align: middle;
}
button.new:hover {
border-top-color: #28597a;
background: #28597a;
color: #ccc;
}
button.new:active {
border-top-color: #1b435e;
background: #1b435e;
}</style>
<p><button class="new">IT-консультации</button></p></a>
</div>
Поделиться4Вс, 9 Авг 2020 22:06:58
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51112
- Уважение: +15195
- Позитив: +11564
- Последний визит:
Сегодня 09:36:05
LandWaterSun
Ну, главное Вас устраивает ??
Поделиться5Пн, 10 Авг 2020 00:28:53
Deff написал(а):
LandWaterSun
Ну, главное Вас устраивает ??
Да, вполне. Единственное, рекомендую выставить шрифт: Arial, Helvetica, sans-serif, будет строже смотреться. Другие шрифты можно посмотреть тут.
Поделиться6Пн, 10 Авг 2020 21:32:12
Deff написал(а):
LandWaterSun
Ну, главное Вас устраивает ??
А как можно поменять цвет кнопок форума "Форум", "О нас", "Участники", "Поиск" и т.д.?
Поделиться7Пн, 10 Авг 2020 21:45:08
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51112
- Уважение: +15195
- Позитив: +11564
- Последний визит:
Сегодня 09:36:05
LandWaterSun
В HTML верх, красное меняете на своё
<style>
#pun-navlinks a { background: none #6C6459; }
</style>
Поделиться8Вт, 11 Авг 2020 00:01:50
Deff написал(а):
LandWaterSun
В HTML верх, красное меняете на своё<style>
#pun-navlinks a { background: none #6C6459; }
</style>
Получилось весьма неплохо, спасибо! См. http://landwatersun.ru/
Код:
<!-- Цвет кнопок -->
<style>
#pun-navlinks a { background: none #124567; }
</style>Поделиться9Вт, 11 Авг 2020 04:35:44
- старая версия нечистой силы
- Зарегистрирован: Пт, 20 Фев 2009
- Сообщений: 2568
- Уважение: +1753
- Позитив: +759
- Пол: Женский
- Последний визит:
Вчера 11:03:40
LandWaterSun
если что, можно открыть (совершенно бесплатно и легально) топик с рекламой форума тут: Наши форумы
*просто подумалось, что вряд ли IT-консультанты не разобрались с кнопками, скорее похоже на контекстную рекламу... 
если нужно покидать ссылочек на ваш форум, то можно и это - юзайте указанный раздел.
Страница: 1