Alsacréations The Ultimate Roundup of Amazing Free Social Media Icon Packs We hope you have enjoyed our last collection of web and user interface icons. This time you are going to get a good and quality collection of social media icons. This list will be very useful for bloggers,web designers and graphic designers to promote their articles and their services. To promote your blog or articles in social media world you need a creative and unique icons and i am sure you will find your most favorite and suitable icons here to include them in your blog or website. 1. A clean set of icons from chethstudios.Re-distribution not allowed! 2. Just another contribution from chethstudios. 3.3D Social media icons This 3D Social Media Icon Pack comes with 20 icons which include your favorite social media websites such as Digg, StumbleUpon, Twitter and lot more from dawghouse design studio.Get the license details of usage from source. 4.Vintage post stamp icons The set comes with 23 icons of your favorite social media sites, all in 200 x 200px and in transparent PNG formats.
CSS3 Create - Démos, tutoriels et expériences CSS : menus, galerie photos, interfaces web. pour PRODUIT ! 20 stunning examples of CSS3 animation | CSS3 Used well, CSS animation is an incredibly useful and powerful tool. It can add interest or creative excitement, direct the user's eye, explain something quickly and succinctly, and improve usability. For that reason, recent years have seen more and more animation on sites and in app. In this article, we round up some of the coolest CSS animation examples we've seen, and show you how to recreate them. What is CSS animation? CSS animation is a method of animating certain HTML elements without having to use processor and memory-hungry JavaScript or Flash. While it may seem limited when it comes to animation, CSS is actually a really powerful tool and is capable of producing beautifully smooth 60fps animations. The best animations still have their roots in Disney's classic 12 principles of animation – you'll see several mentions of that throughout these CSS animation examples, so it's worth checking out that article before you get started. 01. Author: Donovan Hutchinson 02. Author: Adam Kuhn
CSS3 – Créer un slideshow automatique et contrôlable Si vous suivez le compte @NoupeMag sur Twitter (ça marche aussi pour mon compte), vous avez certainement vu passer mon slideshow en CSS3 datant de l’an dernier. Ce n’était pas ma première tentative de slideshow comme le présentent ces premier et second travaux datant de mai 2010. Ce tutoriel ne s’adresse pas aux débutants, il vous faudra un minimum de connaissances techniques pour vous y retrouver dans les tronçons de code qui vont suivre. Avant propos La page de démonstration du slideshow full CSS3 vous propose des fichiers sources en téléchargement, profitez-en, notamment si vous souhaitez récupérer les images. Les codes CSS fournis ici sont légèrement différents de ceux fournis dans l’archive zippée téléchargeable. Les codes CSS3 présents sur ce tutoriel ne tiennent pas compte des préfixes parfois nécessaires (-webkit-, -moz-, -ms-, -o-) pour une question de gain de place dans le code. Les défauts des versions précédentes Sur la version automatique (la seconde) : Poser les fondations
Tutorials The links on this page lead to a variety of tutorials and training materials. Whether you are just starting out, learning the basics, or are an old hand at web development, you can find helpful resources here for best practices. These resources are created by forward-thinking companies and web developers who have embraced open standards and best practices for web development and that provide or allow translations, through an open content license such as Creative Commons. For complete beginners to the Web Getting started with the Web Getting started with the Web is a concise series introducing you to the practicalities of web development. HTML Tutorials Introductory level Introduction to HTML This module sets the stage, getting you used to important concepts and syntax, looking at applying HTML to text, how to create hyperlinks, and how to use HTML to structure a webpage. MDN HTML element reference A comprehensive reference for HTML elements, and how the different browsers support them.
Photo Booth Strips with Lightbox A tutorial about how to create some neat scrollable photo booth strips and integrate Lightbox 2 and customize it in order to make it responsive and touch-device friendly. View demo Download source In today’s tutorial we’ll show you how to create some cute looking photo strips and integrate Lightbox 2, one of the most popular and widely used lightbox scripts. The idea is to show some photo strips and make them navigable by scrolling with the mousewheel. Please note that we might use some new CSS properties that don’t work in older browsers. The amazing images are by talented Sherman Geronimo-Tan and they are licensed under Creative Commons Attribution 2.0 Generic (CC BY 2.0). Lightbox 2 is by Lokesh Dhakar and you can find the script and examples of usage here: Lightbox 2 The Markup Let’s first write the HTML for the four photo strips. Each photo strip wrapper will also have a position class like pb-wrapper-1, pb-wrapper-2, etc. Let’s take a look at the style. The CSS And that’s it!
10 Easy Image Hover Effects You Can Copy and Paste Hover effects are always a fun topic to explore. In the past, we’ve built some awesome examples of CSS hovers that were easy to copy and paste right into your code. Today, we’re going to follow that up with ten new effects specifically built for use with images. Each example comes with an HTML and CSS snippet that you can steal and a live demo so you can see it in action. Sneak Peek Before we get started, take a look at the demo below to see all of the various hover effects that we’ll be building. Demo: Click here to launch. Setup Before we begin creating the individual demos, some basic setup is required. Most of this is basic stuff: box-sizing allows us to manipulate the box model (feel free to apply more specifically if you don’t like the universal selector), and the pic class gives us a place to toss in some generic styling for each photo. Zoom and Pan Our first group of effects involves utilizing some tricks with hidden overflow. Grow Shrink Side Pan Vertical Pan Fun with Transforms Tilt Morph