03 Mar 2015, 18:04 avatar

Свежие эффекты для ваших кнопок на сайте

  1. Автор: Мэри Лу
  2. Адаптировал: irbees2008
  3. Источник: http://tympanus.net/codrops/2015/02/26/inspiration-button-styles-effects/
  4. Уровень сложности исполнения:нужны навыки css html
  5. Демо: в новом окне
Всем привет,уже давненько я ничего не писал,все работа и работа, а на любимое дело времени нет cry .Ну сегодня я увидел новый набор эффектов для кнопок, и они просто обалденные. Ну что же приступим.

Как всегда я выберу для описания первый вариант кнопки,их много и скачав исходник вы можете выбрать свой вариант.
1.Скачиваем архив Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем. ,распаковываем и заливаем папки css и font в папку с вашим шаблоном
2.В нашем шаблоне открываем файл main.tpl и в секцию хеад подключаем стиль кнопок и стиль шрифта
Код:
 <link rel="stylesheet"  href="{{ tpl_url }}/css/vicons-font.css" />
<link rel="stylesheet" href="{{ tpl_url }}css/buttons.css" />
3.Открываем в исходнике файл index.html и ищем свой вариант,ну мне проще я выбрал первый вариант
Код:
 <button class="button button--winona button--border-thin button--round-s" data-text="Open Project"><span>Open Project</span></button>
4.Вот и все ставим код кнопки куда вам нужно,только не забываем в кнопке добавить адрес ,того что она будет делать,это примерно так
Код:
 <button src="Ваш адрес переадресации" class="button button--winona button--border-thin button--round-s" data-text="Open Project"><span>Open Project</span></button>
Если что не понятно пишем в коментариях.

Можешь почитать и вот эту статейку "HTML теги address"

mistakes

0 комментариев

Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.