This tutorial will teach you how to use CSS3 to create even more attractive and easy to maintain websites.
First basics: The Cascading Style Sheets (CSS) are a programming language that allows us to style or format the web page in the way we want. Furthermore, it allows us to separate styling from content, structure and functionality of a web page. The CSS has evolved throughout the years that nowadays it provides a full precision control for elements spacing and positioning, color and gradients, fonts, text, backgrounds and everything else included.
Advantages of CSS3
The CSS3 is built as a group of modules, each of which describing a certain structure or content from a web page; for example these are some of the modules: selectors, animations, user interface, etc... Those modules have capacity to thoroughly deal with each and every aspect of a HTML document's structure in details.
There are numerous advantages of using CSS3. Some of the advantages of using CSS3 are listed here:
- Usage of external style sheets saving site's load time
- Usage of external style sheets simplifying site's coding and troubleshooting
- Differentiation and isolation
- Helps to achieve multi column layout
- Flexibility in Handling
- Handling multiple background images
- Better graphical capabilities
- Better control of over user interface
- And more...
To learn about the CSS3 and understand better all of its perks and cool things about, and to get a grasp on the importance of it, please continue with the chapters that follow.
Browser difficulties in CSS3
The only problem currently with CSS3 is actually the Cross Browser Compatibility problems. At the moment of writing this introduction, it was still a good practice to make styling bullet proof for older browsers, such as Internet Explorer 9.0 and older, as well as using proprietary selectors when possible to make sure that Firefox, Safari, or Chrome will execute properly our shadows and gradients (and other cool stuff offered by CSS3).
Each chapter has attached an interactive example that can be easily modified and tested as wanted.
For the purpose of simplicity many examples are written with internal styles, instead of being imported from an external file as it is suggested.
All examples can be found at the end of the tutorial.
At the end of the tutorial you will find a complete reference list with all properties, modules, etc...