Forms are an essential part of almost any website. Whether it's a simple login form or a lengthy and detailed one, you want your forms to look their best while providing solid functionality. Here is a list of some of the top CSS3 tutorials that will show you how to create forms that stand out from the crowd.
FormBox is a fantastic tutorial that shows you how to create drop down forms that integrate easily into menus. The benefit of such a technique is two-fold. First, it offers functionality without creating extra site clutter. Second, it puts essential site functions right in front of visitors, increasing the user-friendly aspect of your site.
The tutorial will explain how to create various drop down forms that can be used on a variety of sites. The tutorial uses CSS3 and jQuery to create drop downs for a contact form, login form, signup form, and password reset. The forms only appear when the visitor hovers over their specific menu so your site can maintain a clean look. Perhaps the best part about FormBox is that it is so lightweight at just 2.5kb in size.
How to create a multi-step signup form with CSS3 and jQuery
If you have a site that requires membership, you will need a signup form. Even if your site is not a member site, there are plenty of other ways in which a signup form could be useful. This tutorial explains how to create a multi-step signup form on your site, and it does so with plenty of detail.
The tutorial creates four steps for the signup form: username and password, name and email address, age/gender/country, and summary. It shows you how to create each step so that you will have a foundation to create steps of your own for your site's customized form. The tutorial even includes a progress bar that can really help your visitors when filling out lengthy forms. Both CSS3 and jQuery are used in the creation process.
This tutorial is useful if you want to create a simple, clean contact form that will fit in nicely on just about any type of site. While the contact form created is rather simple in its look, it definitely has an upgraded look over a bare bones contact form.
You will learn how to add style to the form layout in terms of box-shadow, border styles, background color, form width, and more. You will also learn how to implement hints that will show up when a visitor hovers over a specific field. This is useful if you have forms with some fields that may require an explanation to eliminate confusion as they are being filled out. Last, but not least, you'll see how to create a submit button that looks great thanks to border-radius, shadow, and other effects.
One of the great things about CSS3 is that it allows you to create several visually pleasing effects without having to use images or scripts. This helps make your site faster in terms of loading, which makes both you and your visitors happy. This particular CSS3 tutorial is a perfect example of how you can spruce up the look of your forms in a quick and lightweight manner.
The tutorial combines various CSS3 techniques such as gradients, box-shadow, opaque colors, and rounded corners to take a simple form and transform it into one with style. All of these techniques are used without the need for any images. Every step used in the transformation process is explained in detail to ensure that you don't get lost along the way. Once finished, you will know how to change the look of your forms with ease.
Style Sheets 
Ten Great CSS3 Tutorials
