CSS CSS Object Model (CSSOM) Introduction


Example

The browser identifies tokens from stylesheet and coverts them into nodes which are linked into a tree structure. The entire map of all the nodes with their associated styles of a page would be the CSS Object Model.

To display the webpage, a web browser takes following steps.

  1. The web browser examines your HTML and builds the DOM (Document Object Model).
  2. The web browser examines your CSS and builds the CSSOM (CSS Object Model).
  3. The web browser combines the DOM and the CSSOM to create a render tree. The web browser displays your webpage.

enter image description here