Готовые кнопки на сайт

Готовые кнопки на сайт

17.04.2021 213 0 t1tov4rt Все для uCoz Кнопки для Ucoz
Привет! В этом материале я подготовил для тебя кучу разных готовых кнопок! Ну а что бы не томить вас, я сразу же начну!
1) Кнопка "Голубая #7accee"
Вот как выглядит эта кнопка:
<style>
.cwd{text-align:center;}
.cwda{cursor:pointer;font-size:14px;text-decoration:none;padding:12px 29px;color:#ffffff;background-color:#7accee;border-radius:5px;border:3px solid #7accee;}
.cwda:hover{background-color:#1da7e2;color:#ffffff;}
</style>
<p class="cwd"><a href="адрес сайта" class="cwda" title="Текст кнопки">Текст кнопки</a></p>
А вот и код:
Код
<style>
.cwd{text-align:center;}
.cwda{cursor:pointer;font-size:14px;text-decoration:none;padding:12px 29px;color:#ffffff;background-color:#7accee;border-radius:5px;border:3px solid #7accee;}
.cwda:hover{background-color:#1da7e2;color:#ffffff;}
</style>
<p class="cwd"><a href="адрес сайта" class="cwda" title="Текст кнопки">Текст кнопки</a></p>

Эту кнопку я взял с сайта "Онлайн Сервис"
2) Кнопка "Серо-Синяя"
Вот так выглядит это "серо-синее" творение:
<style>
.button_1618683875493 {
display: inline-block !important;
text-decoration: none !important;
background-color: #eaeaea !important;
color: #006089 !important;
border: 3px solid #006089 !important;
border-radius: 5px !important;
font-size: 16px !important;
padding: 15px 50px !important;
transition: all 0.8s ease !important;
}
.button_1618683875493:hover{
text-decoration: none !important;
background-color: #006089 !important;
color: #ffeded !important;
border-color: #006089 !important;
}
</style>
<a href="ссылка на сайт" class="button_1618683875493" target="_blank">
Текст кнопки
</a>
А вот и сам код:
Код
<style>
.button_1618683875493 {
  display: inline-block !important;
  text-decoration: none !important;
  background-color: #eaeaea !important;
  color: #006089 !important;
  border: 3px solid #006089 !important;
  border-radius: 5px !important;
  font-size: 16px !important;
  padding: 15px 50px !important;  
  transition: all 0.8s ease !important;
}
.button_1618683875493:hover{
  text-decoration: none !important;  
  background-color: #006089 !important;
  color: #ffeded !important;
  border-color: #006089 !important;
}
</style>
<a href="ссылка на сайт" class="button_1618683875493" target="_blank">
  Текст кнопки
</a>

Кнопка с сайта daruse
3) Кнопка "Лайк" (ЗДЕСЬ НИЧЕГО МЕНЯТЬ НЕ НАДО!)
Вот как она выглядит:
<!-- LikeBtn.com BEGIN -->
<span class="likebtn-wrapper" data-lang="ru" data-identifier="item_1"></span>
<script>(function(d,e,s){if(d.getElementById("likebtn_wjs"))return;a=d.createElement(e);m=d.getElementsByTagName(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode.insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script>
<!-- LikeBtn.com END -->
А вот и код
Код
<!-- LikeBtn.com BEGIN -->
<span class="likebtn-wrapper" data-lang="ru" data-identifier="item_1"></span>
<script>(function(d,e,s){if(d.getElementById("likebtn_wjs"))return;a=d.createElement(e);m=d.getElementsByTagName(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode.insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script>
<!-- LikeBtn.com END -->

Взято с сайта likebtn
4) Кнопки "Поделиться от Яндекс" (ЗДЕСЬ НИЧЕГО МЕНЯТЬ НЕ НАДО!)
Вид кнопок
<script src="https://yastatic.net/share2/share.js"></script>
<div class="ya-share2" data-curtain data-shape="round" data-limit="3" data-services="messenger,vkontakte,facebook,odnoklassniki,telegram,twitter,viber,whatsapp,moimir"></div>
Код
Код
<script src="https://yastatic.net/share2/share.js"></script>
<div class="ya-share2" data-curtain data-shape="round" data-limit="3" data-services="messenger,vkontakte,facebook,odnoklassniki,telegram,twitter,viber,whatsapp,moimir"></div>

На этом кнопки кончаются, поэтому я с вами прощаюсь! Пока.
Файлы для скачивания отсутствуют.
Поблагодарить автора Автор: t1tov4rt
Комментарии (0)
Добавить комментарий
avatar