孙极-Hello, JSS! - 一种新样式语言的诞生

NetEase Mail FETC.Hello, JSS!孙极

JavascriptActionscriptJSS解析PHP⋯⋯

CSS.mod1 { …color:#CC3300;… }.mod2 { …background:#CC3300;… }.mod3 { …border-color:#CC3300;… }.mod4 { …outline:#CC3300;… }…

JSS$color = “ #CC3300 ” ;.mod1 { …color:$color;… }.mod2 { …background:$color;… }.mod3 { …border-color:$color;… }.mod4 { …outline:$color;… }…

常量定义常量：$string1 = ”#CCC”;$string2 = ”10px”;$number1 = 10;$number2 = 10px;

常量使用常量：div{color:$string1;width:$number2;}

常量常量运算：$string1 = ”#CCC”;$string2 = ”10px”;$string1＋$string2#CCC10px

常量常量运算：$num1 = 10px;$num2 = 20;$num1＋$num230px

常量常量运算：$string = “10px”;$num = 20;$string＋$num10px20

CSS.mod1 {...-webkit-box-shadow:0 0 5px #999;-moz-box-shadow:0 0 5px #999;box-shadow:0 0 5px #999;...}.mod2 {...-webkit-box-shadow:0 0 6px #CCC;-moz-box-shadow:0 0 6px #CCC;box-shadow:0 0 6px #CCC;...}...

JSS$shadow($x,$y,$s,$c){-webkit-box-shadow:$x $y $s $c;-moz-box-shadow:$x $y $s $c;box-shadow:$x $y $s $c;}

JSS$shadow($x,$y,$s,$c){-webkit-box-shadow:$x $y $s $c;-moz-box-shadow:$x $y $s $c;box-shadow:$x $y $s $c;}.mod1 { …$shadow(0,0,5px,”#999”); …}.mod2 { …$shadow(0,0,8px,”#ccc”); …}

函数定义函数：$func(){ color:#ccc;}

函数定义函数：$func($a,$b,$c){ color:$a; background:$b; font-size:$c;}

函数定义函数：$func($a=“#ccc”,$b=“#000”,$c=12px){ color:$a; background:$b; font-size:$c;}

函数使用函数：div{$func();}

函数使用函数：div{$func(“#000”,$string1)}

CSS.parent>.child1,.parent>.child2{...}

CSS.link1:hover,.link1:active,.link2:hover,.link2:active{...}

JSS.parent>(.child1,.child2) {...}

JSS(.link1,.link2):(hover,active) {...}

CSS.mod .hd{...}.mod .bd{...}.mod .bd p{...}.mod .bdtable{...}.mod .ft{...}

CSS.mod_hd{...}.mod_bd{...}.mod_bd p{...}.mod_bd table{...}.mod_ft{...}

JSS.mod[[ .hd{...}.bd[[ p{...} table{...} ]] .ft{...}]]

JSS.mod[[ _hd{...}_bd[[ p{...} table{...} ]] _ft{...}]]

CSSdiv{+width:10px;-width:12px;?}

JSSdiv{-ie7-width:10px;-wk-width:15px;-!ie-width:18px;-?sunji-width:20px;...}

CSS.mod.newModclass=“mod newMod”

JSS$mod($s){$s{...}($s) p{...}}$mod (“.mod,.newMod”);

孙极-Hello, JSS! - 一种新样式语言的诞生

More Related Content

Similar to 孙极-Hello, JSS! - 一种新样式语言的诞生 (16)

More from Webrebuild (20)

孙极-Hello, JSS! - 一种新样式语言的诞生