Language"
From Documentation
(Created page with "ZESS, inspired by [http:lesscss.org LESS}, is an extension to CSS. It is compatible with CSS, while allows to use variables, macros and expression with existing CSS syntax. =Var...") |
|||
| Line 1: | Line 1: | ||
| − | ZESS, inspired by [http:lesscss.org LESS | + | ZESS, inspired by [http://lesscss.org LESS], is an extension to CSS. It is compatible with CSS, while allows to use variables, macros and expression with existing CSS syntax. |
=Variables= | =Variables= | ||
==Variable Definition== | ==Variable Definition== | ||
| − | [@''name'': ''value''] | + | [@''name'': ''value'']; |
| + | [@''name'': ''[#Expressions'']; | ||
| + | |||
| + | Example, | ||
| + | |||
| + | <source lang="CSS"> | ||
| + | @nice-blue: #5B83AD; | ||
| + | @light-blue: (@nice-blue + #111); | ||
| + | </source> | ||
| + | |||
| + | ==Variable Use== | ||
| + | @''name'' | ||
| + | |||
| + | Example, | ||
| + | <source lang="CSS"> | ||
| + | @nice-blue: #5B83AD; | ||
| + | @light-blue: (@nice-blue + #111); | ||
| + | |||
| + | div.hilite { color: @nice-blue;} | ||
| + | </source> | ||
| + | |||
| + | Outputs: | ||
| + | |||
| + | <source lang="CSS"> | ||
| + | div.hilite { color: #6c94be;} | ||
| + | </source> | ||
| + | |||
| + | =Macros= | ||
| + | ==Macro Definition== | ||
| + | @''name'' (@''argument-name'': ''default-value'', @''argument-name'': ''default-value'') { | ||
| + | ''CSS content'' | ||
| + | } | ||
| + | |||
| + | =Expressions= | ||
| + | (''expression'') | ||
Revision as of 06:31, 27 October 2011
ZESS, inspired by LESS, is an extension to CSS. It is compatible with CSS, while allows to use variables, macros and expression with existing CSS syntax.
Variables
Variable Definition
[@name: value]; [@name: [#Expressions];
Example,
@nice-blue: #5B83AD;
@light-blue: (@nice-blue + #111);
Variable Use
@name
Example,
@nice-blue: #5B83AD;
@light-blue: (@nice-blue + #111);
div.hilite { color: @nice-blue;}
Outputs:
div.hilite { color: #6c94be;}
Macros
Macro Definition
@name (@argument-name: default-value, @argument-name: default-value) {
CSS content
}
Expressions
(expression)