Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language. Most often used to set the visual style of web pages and user interfaces written in HTML and XHTML.
CSS3 has been split into "modules". It contains the "old CSS specification" (which has been split into smaller pieces). In addition, new modules are added. Some of the most important CSS3 modules are
- Selectors
- Box Model
- Backgrounds and Borders
- Image Values and Replaced Content
- Text Effects
- 2D/3D Transformations
- Animations
- Multiple Column Layout
- User Interface
What's new in CSS3
Independent modules, simplified working: Unlike CSS2 which was comprised of a single document, CSS3 is broken up into many individual modules, improving both functionality and ease of working. It makes CSS3 a whole lot easier to handle given its complexity. Doing this the CSS2 way, would’ve made things very difficult to manage.
Easy to change, easier to view: With the modular structure and new functionalities, CSS3 makes it much easier to make changes. This is possible because individual modules can be easily changed and integrated into the main system. This allows independent individual module testing as well, which makes it easier to pin-point issues and make corrections where required.
Faster development speed: CSS3 has also managed to set new benchmarks in development speed. Many parts of its functionality now include what used to require a CSS – Javascript combo. This way, time is saved during production, during loading and finally towards the end product. In addition the improved flexibility that comes with the modules reduces turnaround times as well.
Cross browser compatibility and platform independence: Today’s end users have plenty of browser options to choose from. This makes browser compatibility a major challenge for all web developers. CSS3 enjoys a wider range of browser support, which was not possible before. Moreover, despite CSS3 not being included in the W3C standards, many browsers are offering support to its new features.
Better backgrounds: Backgrounds no longer need to be static and boring. What previously needed additional scripting and programming, can now be done easily with CSS3. While CSS3 retains its box model, many new style properties have become a part of the parcel. Multiple background images can be included on a page and layered.
Borders and Text Effects: If you’re bored with the standard border variants of solid, double and dashed, CSS3 brings a host of options. An overlooked added feature is the ability to use an image as a border. The CSS3 border-image property allows you to define an image which can be used as a border. The border-image property takes the image and slices it into 9 sections. The middle section can be stretched or repeated.
Playing with images and animation: Before the content catches a reader’s attention, the page layout, quality of images and animation make the first impact. These used to be elements where CSS had limited capabilities and needed Javascript to achieve anything. But things have changed on that front too. image filters are available on CSS and you can do that right here, without having to work with any other software. Transitions, gradients and animations often required JavaScript libraries as well, but not anymore.
Feature testing: CSS3 lends to improved feature testing thanks to its modular structure. Earlier versions needed plenty of testing time as it would be a mammoth task to identify what was causing a certain issue. However, with the new structural break-up, it is now much faster and more efficient. Testing for individual modules can be carried out and they can then be integrated into the complete system.