stylus常用语法结构

1.插值——非常适合目前的不同浏览器兼容问题（个人更偏爱插值，一个模型，多个引用，代表量更少）

vendor(prop, args)

  -webkit-{prop} args

  -moz-{prop} args

  {prop} args

border-radius()

  vendor('border-radius', arguments)

box-shadow()

  vendor('box-shadow', arguments)

button

  border-radius 1px 2px / 3px 4px

---

2.选择器插值——比较适合表格，已经数量不大的有规律的排布

table

  for row in 1 2 3 4 5

    tr:nth-child({row})

      height  10px * row

---

3运算符优先级

[]

! ~ + -

is defined

** * / %

+ -

... ..

<= >= < >

in

== is != is not isnt

is a

&& and || or

?:

= := ?= += -= *= /= %=

not

if unless

---

4.@

当目前样式使用@时，优先引用当前样式有的，如果没有，会向上冒泡

---

5.混合书写——透明度（不太好记住）

support-for-ie ?= true

opacity(n)

  opacity n

  if support-for-ie

    filter unquote('progid:DXImageTransform.Microsoft.Alpha(Opacity=' + round(n * 100) + ')')

#logo

  &:hover

    opacity 0.5

---

6.父级引用——比较难，没看懂，回头再看一遍

---

7.方法——添加单位

add(a, b = a)

  a = unit(a, px)

  b = unit(b, px)

  a + b

add(15%, 10deg)

---

8.内置方法

绝对值 abs(unit)   例子：width   abs（-15.5）

向上取整 ceil(unit)

向下取整 floor(unit)

四舍五入 round(unit)

取较小值  min(a, b)

取较大值 max(a, b)

求和 sum(nums)  例子：width sum（1 2 2 58）px

求平均数  avg(1 2 3)

---

9.url