I am not able to understand the concept of modules. What are these modules and how are they different from CSS2? Can anyone explain these modules in a simple better way? And why these modules make CSS3 different from CSS2 ?
CSS level 2 is a monolithic specification. You have a single specification divided into sections, with each section describing a basic component of the CSS formatting model, for example:
The definitive CSS level 2 standard is CSS2.1, or CSS level 2 revision 1, which became a recommendation in 2011 following a set of changes to the 1998 standard for enhanced interoperability. The CSS2.1 specification can be found here (with the examples above linking to individual sections).
Post-CSS2 you have modules, which are basically various sections of CSS2 split into their own specifications. The above examples from CSS2 have the following corresponding modules:
- Cascading and inheritance
- The box model
- Colors and backgrounds (yes, that's one section split into two modules)
This means you have multiple specifications that all pertain to CSS, each with its own independent development path. This consequently means that different modules can progress toward implementation and standardization at different rates, without having to depend on the rest of CSS as a language (which was the primary cause of CSS2.1 taking so long to become a recommendation following CSS2's standardization). These specifications are collectively known as CSS3, or "CSS level 3", although each goes through levels on its own, making it somewhat of a misnomer.
CSS3 and its modularization system are explained in greater detail in this other answer.
This recipe can be found in it's original form on Stack Over Flow.