This CSS preprocessor does 3 things.
Adds the following line to the top of the CSS file:
@charset "UTF-8";
and sets the content-type string
attribute of the response file to
text/css; charset=utf-8
.
It finds any class selectors starting with a dash and prefixes them with a namespace.
For example, the following CSS snippet:
.foo .-bar {
background: red;
}
could become this:
.foo .NA780EF99--bar {
background: red;
}
where NA780EF99-
contains a random sequence (hash) determined by the contents
of the CSS file.
It is looking for URL references like
.foo {
background: url(bar.png);
}
Note that the file bar.png
MUST BE a descendant of the CSS file itself,
tipically being its child.
URLs are resolved relative to the CSS file itself. If the above CSS snippet
would be contained in the file /style.css
, it will resolve something like
.foo {
background: url(/style.css/bar.png?v=014c103059);
}
where v=014c103059
is used for caching. (v
stands for version.)
NOTE that rewriting the URLs for caching will be moved to higher levels.
.Main
.Request