المشاركات

عرض الرسائل ذات التصنيف CSS Buttons

Create Round Social Media Icons / Buttons using CSS

صورة
Hi, in this post we'll see how to create round social media icons using pure CSS3 . We all know how much impact do social signals have on websites and blogs. Here I'll show you the way to create clean and neat social media icons without images using a vector font library called Font Awesome. Font Awesome is the best icon font available and relatively easy to implement in your websites. They are highly scalable icons which means the social media icons we create will look good even in bigger size. How to Create Social Network Icons with CSS? To create these css social media icons, all we want to do is 1. Create some css styles, 2. Use Font awesome in those styles to draw up the icons and 3. Apply them to <a> anchor tag. No need to add <div>. You don't even have to download the fonts to use it in your website or blog. Just place the below <link> tag inside the <head> section of the HTML file. <link href="//netdna.bootstrapcdn.com/fo...

5 Free Black and White Social Media Icons Sets with CSS and HTML

صورة
Hi! In this article I've come up with 5 modern sets of black and white social media icons using pure css3 and html code. As social media plays major role in creating brand awareness, one cannot overlook the importance of implementing social sharing buttons in their websites. And this article is going to help you with five different styles of social icons to use in your websites. Moreover these icons are built without using images which will improve your website's loading speed too. Like my earlier tutorials on pure css social media icons , this post too will use font awesome library. Font Awesome is a scalable vector font library and its icons can be easily customized using css to fit with the rest of your website's theme. It is originally developed for bootstrap but works great with all the other frameworks and even with plain html. Load Font Awesome Library in HTML File To use these css social media icons you need font awesome library. Use this line of code in...

Create Stylish Bootstrap 3 Social Media Icons | How-To Guide

صورة
Hi, I’m going to show you how to create bootstrap 3 social media icons without images . Yes! We are going to use an icon font library called Font Awesome. It is a scalable vector icon font which is supported by all modern browsers and IE version of 8 or above. It can be used to add social media buttons (ex., Login with Facebook button) or social media icons for websites without images. Also it’s fully compatible with Twitter Bootstrap 3 and we’ll see how to use it for adding social media icons in bootstrap websites. Did you see the tiny round social media icons in the above image? Awesome isn’t it? Those are css social media icons without using any images. Also they are fully customizable by their size, color and effects, hence the possibilities are unlimited. All we have to do is style the icons with little bit of css code. Font Awesome is not only limited to bootstrap sites and you can use it on any other types of sites built in html/css websites, wordpress blogs etc. Addi...