CSS3 brings us infinite new possibilities and allows styling to make better web forms. CSS3 gives us a number of new ways to create an impact with our form designs, with quite a few important changes. HTML5 introduced useful new form elements such as sliders and spinners and old elements such as textbox and textarea, and we can make them look really cool with our innovation and CSS3. Using CSS3, we can turn an old and boring form into a modern, cool, and eye catching one.

CSS3 is completely backwards compatible, so we will not have to change the existing form designs. Browsers have and will always support CSS2.

CSS3 forms can be split up into modules. Some of the most important CSS3 modules are:

Styling of forms always varies with requirements and the innovation of the web designer or developer. In this chapter, we will look at those CSS3 properties with which we can style our forms and give them a rich and elegant look.

Some of the new properties of CSS3 required vendor prefixes, which were used frequently as they helped browsers to read the code. In general, it is no longer needed to use them with CSS3 for some of the properties, such as border-radius, but they come into action when the browser doesn't interpret the code. A list of all the vendor prefixes for major browsers is given as follows:

Before we start styling the form, let us have a quick revision of form modules for better understanding and styling of the forms.