Language"

From Documentation
Line 10: Line 10:
  
 
<source lang="CSS">
 
<source lang="CSS">
@nice-blue: #5B83AD;
+
@nice_blue: #5B83AD;
@light-blue: (@nice-blue + #111);
+
@light_blue: (@nice_blue + #111);
 
</source>
 
</source>
 +
 +
The name must be composed of letters, numbers, and the underscore. The name may only begin with a letter and the underscore.
  
 
==Variable Use==
 
==Variable Use==
Line 19: Line 21:
 
Example,
 
Example,
 
<source lang="CSS">
 
<source lang="CSS">
@nice-blue: #5B83AD;
+
@nice_blue: #5B83AD;
@light-blue: (@nice-blue + #111);
+
@light_blue: (@nice_blue + #111);
  
div.hilite { color: @nice-blue;}
+
div.hilite { color: @nice_blue;}
 
</source>
 
</source>
  

Revision as of 06:35, 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);

The name must be composed of letters, numbers, and the underscore. The name may only begin with a letter and the underscore.

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)