CSS - Preprocessor

About

A preprocessor takes an arbitrary source file and converts it into something that the browser understands.

Preprocessors implements features that browser doesn't support natively such as:

  • CSS selectors nesting
  • module (template)
  • import without http request. See CSS - @import rule
  • vendor prefix grouping
  • Inheritance of properties (Same property for a message but different color for waning, info)
  • Mathematics Operators

In-browser preprocessor editing can be done with the following browser features:

  • local file editing (workspaces)
  • automatic reloading

Example

Source Map

CSS - Source Map

Documentation / Reference





Discover More
CSS - Less

Less is a preprocessors for Css. See .
CSS - Sass (scss)

Sass is a css preprocessor. It has four syntax parsers: scss (Sassy CSS), sass, CSS, and less with with
Chrome Enable Source Map
CSS - Source Map

For each CSS file it produces, a CSS preprocessor generates: a source map file (.map) and the compiled CSS. The source map file is a JSON file that defines a mapping between: each (compiled|generated)...



Share this page:
Follow us:
Task Runner