qiwi
ПОСЛЕДНИЕ ПУБЛИКАЦИИ
ПОДПИСКА
Будь В Курсе
Подпишись, и получай эксклюзивные обновления на свой E-Mail:

Ваш E-Mail полностью защищён

ОБСУЖДЕНИЕ

Кнопка с анимационным фоном

Круглая кнопка с анимационным фоном на css3
Просмотров: 1894  Скачан: 215 раз  Комментариев в теме: 0

Красивая кнопка для сайта в круглом стиле, реализована с помощью css3. Анимация фона происходит при наведении курсора на кнопку, эффект выглядит довольно привлекательно. Кнопка работает во всех современных браузерах.

Шаг 1 - создание разметки

 

HTML

<div class="button-wrapper">
    <a href="#" class="a-btn">
        <span></span>
    <span>Войти</span>
        <span>Жми сюда</span>
    </a>
    <a href="#" class="a-btn">
        <span></span>
    <span>Начать</span>
        <span>Жми сюда</span>
    </a>
    <a href="#" class="a-btn">
        <span></span>
    <span>Ввод</span>
        <span>Жми сюда</span>
    </a>
    <a href="#" class="a-btn">
        <span></span>
    <span>Скачать</span>
        <span>Жми сюда</span>
    </a>
</div>

Шаг 2 - подключение стилей

 

CSS

<link rel="stylesheet" href="css/style.css" type="text/css" />
Материалы по теме:

Pack кнопок #3 на CSS3Pack кнопок #3 на CSS3

Pack кнопок №3 на css3, в пак вошло около 70 кнопок разного размера, цвета (круглые, прямоугольные, градиентные)....

Кнопки для вашего сайта на css3Кнопки для вашего сайта на css3

Неплохие кнопки для вашего сайта на css3, кнопки разного цвета и размера (голубой, розовый, зелёный, оранжевый)....

30 анимационных кнопок на CSS330 анимационных кнопок на CSS3

Неплохие анимационные кнопки на css3, имеются 30 кнопок, в том числе и 3D....

Кнопка Download на css3Кнопка Download на css3

Красивая кнопка на css3, при наведении курсора мыши на кнопку, она раскрывается, за тем уже виден сам подтекст....

Социальные кнопки на CSSСоциальные кнопки на CSS

Стильные кнопки социальных сетей (Facbook, Twitter, Google+) с применением иконических шрифтов....

Набор градиентных кнопок на css3Набор градиентных кнопок на css3

Неплохой набор кнопок, в нем вы найдёте кнопки разного цвета, (округлённые, прямоугольные, маленькие)....

Кнопка вкл/выкл (checkbox) на CSS3Кнопка вкл/выкл (checkbox) на CSS3

Привлекательная кнопка с ряда (checkbox), как все вы наверное уже догадались, кнопка имитирует реалистично кнопку включения....
Интересные публикации:

Music v1.4.3Music v1.4.3

Music - это шаблон музыкального портала для wordpress с уникальным набором функций и настроек....

FolderFolder

Универсальный html шаблон Folder, на главной странице располагается слайдер с миниатюрами и комментариями к изображению, есть галерея......

Фиксированое меню (вертикальное и горизонтальное)Фиксированое меню (вертикальное и горизо...

Неплохое фиксированное меню для вашего сайта, меню может быть горизонтальным и вертикальным......

Скрипт почтовой рассылки писем SendMailСкрипт почтовой рассылки писем

SendMail - это инструмент для организации рассылки почтовых сообщений с вашего сайта любой информации и включает в себя всё то, что нужно email-маркет...

Оригинальные кнопки с помощью css3Оригинальные кнопки с помощью css3

Оригинальные кнопки на css3, при наведении курсора на кнопку, она изменяет свой вид (растягивается, округляется, перекручивается)....

Социальные кнопки на CSSСоциальные кнопки на CSS

Стильные кнопки социальных сетей (Facbook, Twitter, Google+) с применением иконических шрифтов....

Sngine v1.6 и v1.8Sngine v1.6 и v1.8

Sngine - это движок социальной платформы, с помощью его вы можете создать социальный сайт или же онлайн сообщество....
  • Текущий 1.44/5
  • 1
  • 2
  • 3
  • 4
  • 5

Рейтинг: 1.4/5( Голосов 9 )

Комментариев в теме: (0)

Авторизация:
YandexGoogleVKMail.ruTwitterFacebookOdnoklassniki


Ваше имя:
Сайт:
Ваша почта:
RSS
Комментарий:
Введите символы:
captcha
Обновить