Показать Меню
falbar Кнопки для сайта, кнопка в корзину, кнопка мне нравиться, кнопка в избранное

Кнопки для сайта одним набором

Кнопки для сайта, кнопка в корзину, кнопка мне нравиться, кнопка в избранное

Продолжаем прокачивать дизайн наших страниц, и сегодня я хочу обратить ваше внимание на целую палитру красивых кнопок для сайта. «Правильно» расставленные кнопки – это душа продающего сайта, они должны привлекать внимание пользователя, чтобы он не смог покинуть страницу не нажав парочку из них. Маркетинг прочно впился в дизайнерскую часть и его не обойдешь стороной, если конечно Вы не содержите захудалый сайт с парой-тройкой посетителей. Красивая и призывная кнопка для посетителя - как красная тряпка для быка, оно вроде ему и не надо, но манит чертовка.

Открываем демо материал и изучаем представленный вариант, фактически полностью готового кнопочного функционала. Все что остается – это прикрепить соответствующий файл со стилями на свою страницу, а далее просто копируем CSS классы к нужным элементам. Кнопки подобраны в стилистические группы: есть и «в корзину», и «мне нравится», и звёздочка для избранного, и много чего ещё – остается только выбрать что из этого Вам нужно.

К слову, эффекты разбиты на классы и подклассы и выглядят так:

<button class="btn btn-1 btn-1a">Кнопка</button>

Формируется кнопка при добавлении к нему трех классов:

  • btn – общие стили для всех видов кнопок;
  • btn-1 – стили к конкретному виду кнопок;
  • btn-1a – стили для эффекта.

Собственно, это формальное разделение, и сделано для того, чтобы демо материал кнопок был легко читаем. Для реальных проектов лучше прописать свои отдельные классы или скопировать нужные строки из библиотеки в уже существующие. Ну, а для ленивых Ctrl+C/Ctrl+V в помощь.

Источник
tympanus.net

Подписаться на обновления

Комментариев еще не оставлено