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

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

ОБСУЖДЕНИЕ

Кнопки для сайта на css

Красивые кнопки для сайта на css
Просмотров: 2517  Скачан: 223 раз  Комментариев в теме: 0

Красивые кнопки для сайта реализованные с помощью css, кнопки представлены разного цвета, ничего лишнего, отлично подойдут к светлому дизайну сайта.

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

 

HTML

<div class="container">
    <div class="topList clear">
        <a href="#" class="button grey">Download</a>
        <a href="#" class="button red">Download</a>
        <a href="#" class="button blue">Download</a>
        <a href="#" class="button green">Download</a>
        <a href="#" class="button black">Download</a>
        <a href="#" class="button yellow">Download</a>
        <a href="#" class="button purple">Download</a>
        <a href="#" class="button gblue">Download</a>
    </div>
    <div class="groupList clear">
        <a href="#" class="button grey left">Download</a>
        <a href="#" class="button grey right">Demo</a>
        <a href="#" class="button blue left">Downloads</a>
        <a href="#" class="button blue middle">Demo</a>
        <a href="#" class="button blue right">Information</a>
        <a href="#" class="button yellow left">Download</a>
        <a href="#" class="button yellow middle">Demo</a>
        <a href="#" class="button yellow middle">Wow another button</a>
        <a href="#" class="button yellow right">Information</a>
    </div>
    <div class="largeList clear">
        <a href="#" class="button yellow large">Download</a>
        <a href="#" class="button red large">Demo</a>
        <a href="#" class="button purple large">Wow another button</a>
        <a href="#" class="button gblue large left">Information</a>
        <a href="#" class="button gblue large middle">Information</a>
        <a href="#" class="button gblue large right">Information</a>
    </div>
</div>

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

 

CSS

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

Социальная панель на css3Социальная панель на css3

Красивая раскрывающиеся социальная панель на css3 с использованием иконических шрифтов. При наведении курсора на значок, происходит раскрытие панели, ...

Сборка кнопок #2 на css3Сборка кнопок #2 на css3

В сборку вошли 12 неплохих кнопок на css. Кнопки работают в браузерах OPERA, Firefox, Chrome, IE....

Блок на CSS3 c эффектом 3D трансформацииБлок на CSS3 c эффектом 3D трансфор...

Блок реализован с помощью css3 и использует 3D трансформацию для изменения своего вида....

Резиновые кнопки на css3 (Checkbox)Резиновые кнопки на css3 (Checkbox)

Ещё один красивый чекбокс, который реалистично имитирует резиновые кнопки, ну или мягкие как их ещё называют....

Сборка социальных кнопок на css3Сборка социальных кнопок на css3

Неплохая сборка социальных кнопок на css3, к кнопкам применён иконический шрифт....

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

Pack стильных кнопок на css3, в паке представлены восемь кнопок разного размера и цвета....

Mega Web Buttons PackMega Web Buttons Pack

Mega Pack кнопок на css, в паке собрано около 40-ка кнопок с разными иконками....
Интересные публикации:

Оригинальная анимационная контактная формаОригинальная анимационная контактная фор...

Оригинальная анимационная контактная форма, в довольно привлекательном стиле. Форма представлена в виде открытого конверта, при наведении курсора мыши...

Красивые кнопки на css3Красивые кнопки на css3

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

Прозрачный аккордеон с помощью css и jqueryПрозрачный аккордеон с помощью css и jqu...

Прозрачный вертикальный аккордеон, с плавным эффектом раскрытия......

PHP скрипт комментариевСкрипт комментариев

Commentics v2.4 - это превосходный скрипт комментариев написанный на языке PHP в связке с базой данных MYSQL....

Шаблон Desire Night ClubШаблон Desire Night Club

HTML шаблон ночного клуба, на главной странице располагается привлекательный слайдер, есть галерея, видео проигрыватель, заготовлена контактная форма ...

12 кнопок с анимацией на css312 кнопок с анимацией на css3

Представлено 12 кнопок с разной анимацией, так как кнопки на css3, в старых браузерах полноценно они работать не будут....

Скроллер картинокСкроллер картинок

Красивый скроллер для вашего сайта, имеет возможность прокручиваться как в левую сторону, так и в правую......
  • Текущий 1.50/5
  • 1
  • 2
  • 3
  • 4
  • 5

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

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

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


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