blob: cc913fe0483b2b3811afedc3614b7ae74567738c (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
/*
*supports:
* 1. standard arithmetic operations (+, -, *, /, %)
* 2. / is treated as css operator, unless one of its operands is variable or there is another binary arithmetic operator
*limits:
* 1. cannot mix arithmetic and css operations, e.g. "margin: 1px + 3px 2px" will fail
* 2. space between add and minus operator and their following operand is mandatory. e.g. "1 + 2" is valid, "1+2" is not
* 3. parenthesis is not supported now.
*/
$div: 10px;
.foo {
font: 10px/8px; // Plain CSS, no division
font: $div/2; // Uses a variable, does division
margin-left: 5px + 8px/2px; //Uses +, does division
}
.foo{
size: 5 % 2; // modular
}
$mul: 2*4; //valid multiply in variable
$mul1: 2 * 4; //valid multiply in variable
.foo{
bar: $mul;
bar: $mul1;
bar: 3*4; //valid multiply in declaration
}
.foo {
bar: 2 +3; //'+' is regarded as an unary operator, because no space between '+' and '3'
bar: 2+ 3; //valid add expression
bar: 2 + 3; //beautiful valid add expression
}
.foo {
bar: 2 -3; //'-' is regarded as an unary operator, because no space between '-' and '3'
bar: 2 - 3; //beautiful valid minus expression
bar: 2- 3; //valid minus expression
}
.foo {
bar: 2 + 3 * 4; // combinations
}
|
