HTML5 and CSS3 are the next generation of the web, and will redefine the possibilities in web design and web development. When combined with an action oriented language such as jQuery, the range of effects and applications that can be created are amazing.
In this collection, we’ve gathered up some fresh and useful HTML5 and CSS3 tutorials. While some are just solely CSS3 tutorials and others HTML5 tutorials, there are also some that combine with jQuery and still others that are HTML5, CSS3 and jQuery tutorials.
If you need more CSS3, HTML5 and jQuery, check out these posts:
- 10 Productivity Enhancing CSS and CSS3 Tools and Generators
- 20 Shockingly Cool HTML5 Canvas Applications
- Fresh and Useful HTML Tutorials
- The Ultimate HTML5 Toolbox
- Way Cool CSS3 Typography Experiments
- 30 Awesome jQuery Navigation Menu Tutorials + Plugins
- 10 Awesome CSS3 Techniques You’ll Want to Start Using
- The Ultimate CSS3 Toolbox
Coding a Rotating Image Slideshow with HTML5, CSS3 and jQuery
Today we are going to use jQuery and CSS3 rotations, along with the jQuery rotate plugin, to create a beautiful slideshow. You can use it to spice up your web sites, product pages and other projects with some CSS3 magic.
Create a MultiStep Signup form with CSS3 and jQuery
In this tutorial we will see how to create a simple multi-step signup form using CSS3 and jQuery. To spice up things a bit, we will include progress bar with the form, so the users will be able to see the percentage of form completion.
How to Create Social Media Buttons using CSS3
CSS3 is truly amazing. It gives web designers the ability to create flexible and easily reusable design elements, and reduces our reliance on images and graphics editors. This is a guide shows you how to create stylish social media buttons using CSS3, HTML, and some freely available social media icons.
Code a Vibrant Professional Web Design using CSS3 and HTML5
In this second part of this web design tutorial series, we will convert the vibrant and professional design we designed in Part 1. We will use HTML5 and CSS3, as a proof of concept and as a way for you to learn these upcoming W3C standards through practice. We will also use the 960 Grid System to speed up development time.
Designing Search Boxes with HTML5 and CSS3
Smashing Magazine did a piece on Search Boxes which inspired me to write this post. Instead of listing various types of designs, I will show you how to build them!
An Introduction to CSS3 3D Transforms
The CSS 3D Transforms module has been out in the wild for over a year now. Currently, only Safari supports the specification – which includes Safari on Mac OS X and Mobile Safari on iOS.
Create a Cute Popup Bar with HTML5, CSS3 and jQuery
Today we’ll be creating a bar that pops up at the top of a page, and stays above the content (similar to ‘hellobar’). The popup bar was only tested in Chrome and Safari and may not work in other browsers. The bar can be used to display information, for example your latest blog post, to the user.
Happy Holidays with CSS3
New year is coming and I want to wish all of you Happy Holidays. For this reason, I made a little CSS3 experiment (with absolutely no images) and I hope you’ll enjoy it.
Creating 3D Buttons with CSS3 and jQuery
We’re going to look at how to create a 3D button using very basic CSS and jQuery. This 3D button will better reflect the interactive abilities of many sites. The example that I will be using is from a recent web project that needed a button to toggle a tutorial mode on and off.