Скрипты для сайтов — кнопка на CSS

Скрипты для сайтов — кнопка на CSS

Скрипты для сайтов — кнопка на CSS

Листинг кода:

<style> .button26 { position: relative; display: inline-block; border-radius: 100px; outline: none; box-shadow: 0 0 2px 2px rgba(0,0,0,.3) inset, 0 1px 1px rgba(255,255,255,.2); background: #8a7b78 linear-gradient(#8a7b78, #cdcdcd); } .button26 span { position: relative; display: block; width: 50px; height: 100px; border: solid transparent; border-width: 0 0 0 50px; border-radius: 100px; outline: none; overflow: hidden; } .button26 span:before { content: ""; position: absolute; left: -50px; height: 100px; border-right: 50px solid transparent; border-left: 50px solid #bfddf5; border-radius: 100px; } .button26:after { content: "\260e"; position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 80px; height: 80px; line-height: 80px; font-size: 300%; font-weight: 700; text-align: center; text-shadow: #2e7ebd 0 1px 2px; color: #fff; margin: auto; border-radius: 100px; background: #75a7cd linear-gradient(#75a7cd, #5084a8); box-shadow: 0 2px 2px rgba(255,255,255,.5) inset, 0 -2px 2px rgba(0,0,0,.3) inset, 0 0 2px 2px rgba(0,0,0,.3); } .button26:focus span { -webkit-animation: background1 10s linear forwards; animation: background1 10s linear forwards; } .button26:focus span:before { -webkit-animation: rotate1 10s linear forwards; animation: rotate1 10s linear forwards; } .button26:focus:after { background: #5390b8 linear-gradient(#5390b8, #6ba9d4); } @-webkit-keyframes background1 { 49.999% {border-width: 0 0 0 50px; border-color: transparent;} 50%, 100% {border-width: 0 50px 0 0; border-color: #bfddf5;} } @-webkit-keyframes rotate1 { 49.999% {left: -50px;} 50% {left: 0px;} 100% {-webkit-transform: rotate(360deg); left: 0px;} } @keyframes background1 { 49.999% {border-width: 0 0 0 50px; border-color: transparent;} 50%, 100% {border-width: 0 50px 0 0; border-color: #bfddf5;} } @keyframes rotate1 { 49.999% {left: -50px;} 50% {left: 0px;} 100% {transform: rotate(360deg); left: 0px;} } </style> 

<a href="#" class="button26" tabindex="0"><span></span></a>

Обмен визитами — бесплатная раскрутка сайта.

Самый простой способ, это по старинке, обмен визитами через ввод адреса сайта в форму:

Ссылка не должна превышать 200 символов и должна обязательно являться URL адресом. Без пробелов.

Трейн-чекс Уроки WEB программирования.

1. ПОДДЕРЖАТЬ ПРОЕКТ на WebMoney
2. WEST-HOSTER
3. ПОРТАЛ СООБЩЕСТВА 🕶️
4. HTML JS CSS РЕДАКТОР
5. ШРИФТЫ ДЛЯ САЙТОВ
6. ПРОМПТЫ ДЛЯ ШЕДЕВРУМА
7. Символ неразрывного пробела
8. Скрипт считывания клавиш
9. Файлы куки
10. AJAX счётчик кликов
11. Запрет кэширования JS и PHP
12. Координаты курсора JS
13. Числа от 1 до 10 на JS
14. Перевести двоичный код в кратный на JS
15. CSS на JavaScript
16. Новые теги HTML
17. Может ли HTML 6 заменить JavaScript
18. HTML форма без перезагрузки страницы
19. Смайлы эмоджи — ГЕНЕРАТОР
20. Форматы изображений
21. Скрипт AJAX лайков и дизлайков
22. Горячие клавиши
23. Скачать изображение в CANVAS
24. Какими будут сайты будущего?
25. Что делает администратор сайта
26. Девушка фурри Милка Маус
27. CMS движки для сайтов

28. Мануалы PHP

29. Мануалы PHP — Фильтры
30. Мануалы PHP — Узнать IP адрес
31. Мануалы PHP — Файлы папки директории
32. Мануалы PHP — Вывод файлов scandir()
33. Мануалы PHP — Отправка данных из формы
34. Мануалы PHP — Запись данных в файл
35. Мануалы PHP — Запрет повторной отправки формы
36. Мануалы PHP — Дата и время
37. Мануалы PHP — Отправка E-mail
38. Мануалы PHP — Работа с изображениями
39. Мануалы PHP — Вход по паролю
40. Отправка формы AJAX
41. Геолокация на PHP, узнать город
42. Выполнение PHP скрипта по клику
43. Маскировка ссылок
44. Таблица умножения

45. Анимация JS

46. Шифровка текста на JS
47. Безумный текст
48. Компрессор кода
49. Уведомления на рабочий стол
50. Перезагрузка на JS и PHP
51. Рейтинг на JS и PHP
52. Виджет комментариев на PHP
53. Рекламный баннер на CSS
54. Запрет копирования
55. Узнать код клавиш
56. Скрипт кода клавиш
57. Конвертер кода в спецсимволы
58. Бесконечный алерт
59. Вывод случайных фраз
60. Откуда пришёл посетитель на JS
61. CSS type radio checkbox
62. Эффекты с текстом
63. Посетители онлайн на PHP
64. Cookie счётчик посещений
65. Анимация текста
66. Type — range
67. Лабиринт на JS
68. Дата и время на JS
69. CSS меню блокнот
70. CSS меню книжная полка
71. CSS вращающийся баннер
72. JavaScript азбука морзе
73. JavaScript копирайт
74. JavaScript анимация текста
75. JavaScript звуки
76. Кнопка вверх
77. Подсчёт символов на JavaScript
78. Работа с куками на PHP

79. AXAJ -JS

80. AJAX счётчик кликов
81. Генератор случайных чисел
82. PHP счётчик страниц
83. PHP запись файлов
84. Дата посещения страницы на PHP
85. Счётчик лайков на PHP
86. Дата изменения страницы
87. Игра JS — угадай число
88. Круговое меню для сайта
89. Навигатор
90. Запрет копирования
91. Вычислить дату на JS
92. Кнопка на CSS
93. view-source: исходный код
94. Анимация JS
95. Время проведённое на сайте
96. Календарь JS
97. Снег для сайта
98. Анимация волны
99. Добавить в избранное
100. Срок жизни сайта
101. Таймер на JS
102. Блокировка мыши и клавиатуры
103. Приветствие по времени суток
104. JS время
105. Яндекс поиск