Skip to content

Latest commit

 

History

History
22 lines (13 loc) · 1.1 KB

oocss.md

File metadata and controls

22 lines (13 loc) · 1.1 KB

OOCSS

OOCSS stands for Object Oriented CSS, an approach for writing CSS that's fast, maintainable, and standards-based.

The purpose is to encourage code reuse and, ultimately, faster and more efficient stylesheets that are easier to add to and maintain.

A CSS "object" is a repeating visual pattern, that can be abstracted into an independent snippet of HTML, CSS, and possibly JavaScript. That object can then be reused throughout a site.

There are two main principles:

  1. Separate structure and skin
  2. Separate container and content

Separate structure and skin means to define repeating visual features as separate "skins" that you can mix-and-match to achieve visual variety.

Separate container and content means rarely using location-dependent styles. An object should look the same no matter where you put it.

Links