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

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

ОБСУЖДЕНИЕ

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

Сборка социальных кнопок на css3
Просмотров: 1261  Скачан: 190 раз  Комментариев в теме: 0

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

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

 

HTML

<div class="rip">
    <div class="rip_rip">
        <a href="#" class="facebook socialBtn">Like us on Facebook</a>
        <a href="#" class="twitter socialBtn">Follow me on Twitter</a>
        <a href="#" class="linkedIn socialBtn">Join up on Linked in</a>
        <a href="#" class="flickr socialBtn">Flickr Photostream</a>
        <a href="#" class="rss socialBtn">Grab our RSS feed</a>
        <a href="#" class="skype socialBtn">Add us on Skype</a>
        <a href="#" class="vimeo socialBtn">Watch on Vimeo</a>
        <a href="#" class="viddler socialBtn">Watch on Viddler</a>
        <a href="#" class="deviantart socialBtn">deviantART gallery</a>
        <a href="#" class="paypal socialBtn">Pay using PayPal</a>
        <a href="#" class="dribbble socialBtn">Dribbble shots</a>
    </div>
    <div class="rip_rip">
        <a href="#" class="tumblr socialBtn">Follow my Tumblog</a>
        <a href="#" class="wordpress socialBtn">Wordpress blog</a>
        <a href="#" class="stumbleupon socialBtn">Stumbleupon this</a>
        <a href="#" class="digg socialBtn">Digg this</a>
        <a href="#" class="lastfm socialBtn">Listen on last.fm</a>
        <a href="#" class="youtube socialBtn">YouTube channel</a>
        <a href="#" class="blogger socialBtn">Blogger weblog</a>
        <a href="#" class="google socialBtn">Add to iGoogle</a>
        <a href="#" class="picasa socialBtn">Picasa photo album</a>
        <a href="#" class="gowalla socialBtn">Follow me on Gowalla</a>
        <a href="#" class="designmoo socialBtn">Designmoo resources</a>
    </div>
</div>

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

 

CSS

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

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

Отличная сборка кнопок №3 на css3, в сборку вошли (раскрывающиеся кнопки, градиентные кнопки, круглые кнопки, анимационные)....

Кнопка с ценником на css3Кнопка с ценником на css3

Красивая анимационная кнопка с ценником, кнопка представлена в разных цветовых стилях (зелёный, синий). При наведении курсора на кнопку, иконка......

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

Отличная кнопка на css3, кнопка реально классная и удобная, да и привлекает глаза посетителя....

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

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

Сборка кнопок на cssСборка кнопок на css

Лёгкая подборка кнопок на css, в подборку вошли восемь разных кнопок созданных с помощью css....

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

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

Анимационная кнопка с помощью css3Анимационная кнопка с помощью css3

Красивая анимационная кнопка похожая на 3D, при наведении курсора мыши на кнопку, она плавно......
Интересные публикации:

Фиксированная форма обратной связи на PHP и jQueryФиксированная форма обратной связи на PH...

Довольно простая форма обратной связи без капчи, проверки полей, сообщений об ошибке и всего прочего......

Горизонтальное меню с выдвигающимися иконкамиГоризонтальное меню с выдвигающимися ико...

Неплохое горизонтальное меню с выдвигающимися иконками. Когда вы переходите по навигации, иконки......

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

Отличная кнопка на css3, кнопка реально классная и удобная, да и привлекает глаза посетителя....

Слайдер с элементом HTML5 СаnvasСлайдер с элементом HTML5 Саnvas

Слайдер построенный с применением элемента HTML5 Саnvas, этот элемент позволяет создавать и изменять некоторую графику, так же его можно......

Аккордеон изображенийАккордеон изображений с помощью css3

Красивый горизонтальный аккордеон для вывода изображений на сайте....

Полноэкранное меню на css и JQueryПолноэкранное меню на css и JQuery

Полно-экранное меню на css и Jquery с меняющимся фоном....

Новостной слайдер «Lof JSliderNews 2.0»Новостной слайдер «Lof JSliderNews 2.0»

Неплохой новостной слайдер, отлично подойдёт для вывода последних новостей на сайте, в слайдере есть дополнительная панель с миниатюрами......
  • Текущий 1.70/5
  • 1
  • 2
  • 3
  • 4
  • 5

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

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

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


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