stylus中文版参考文档之条件(Conditionals)
回到相关文章 »文档:
- 选择器(Selectors)
 - 变量(Variables)
 - 插值(Interpolation)
 - 运算符(Operators)
 - 混合书写(Mixins)
 - 方法(Functions)
 - 关键字参数(Keyword Arguments)
 - 内置方法(Built-in Functions)
 - 其余参数(Rest Params)
 - 注释(Comments)
 - 条件(Conditionals)
 - 迭代(Iteration)
 - @import
 - @media
 - @font-face
 - @keyframes
 - @extend
 - url()
 - CSS字面量(CSS Literal)
 - CSS样式解析(CSS Style Syntax)
 - 字符转码(Char Escaping)
 - 可执行性(Executable)
 - 错误报告(Error Reporting)
 - 连接中间件(Connect Middleware)
 - 自检API(Introspection API)
 - JavaScript API
 - Nib下CSS扩展(CSS3 Extensions with Nib)
 - Stylus在线体验!
 
详细:
条件(Conditionals)
条件
条件提供了语言的刘控制,否则就是纯粹的静态语言。提供的条件有导入、混入、函数以及更多。下面的例子纯粹示例,并不是使用建议。
if / else if / else
这没什么好说的,跟一般的语言一致,if表达式满足(true)的时候执行后面语句块,否则,继续后面的else if或else.
下面这个例子,根据overload的条件,决定是使用padding还是margin.
overload-padding = true
if overload-padding
  padding(y, x)
    margin y x
body
  padding 5px 10px
        另外的例子:
box(x, y, margin = false)
  padding y x
  if margin
    margin y x
body
  box(5px, 10px, true)
        另外的box()帮手:
box(x, y, margin-only = false)
  if margin-only
    margin y x
  else
    padding y x
    	除非(unless)
熟悉Ruby程序语言的用户应该都知道unless条件,其基本上与if相反,本质上是(!(expr)).
下面这个例子中,如果disable-padding-override是undefined或false, padding将被干掉,显示margin代替之。但是,如果是true,
        	padding将会如期继续输出padding 5px 10px.
        
disable-padding-override = true
unless disable-padding-override is defined and disable-padding-override
  padding(x, y)
    margin y x
body
  padding 5px 10px
  		后缀条件
Stylus支持后缀条件,这就意味着if和unless可以当作操作符;当右边表达式为真的时候执行左边的操作对象。
例如,我们定义negative()来执行一些基本的检查。下面我们使用块式条件:
negative(n)
  unless n is a 'unit'
    error('无效数值')
  if n < 0
    yes
  else
    no
        接下来,我们利用后缀条件让我们的方法简洁。
negative(n)
  error('无效数值') unless n is a 'unit'
  return yes if n < 0
  no
        当然,我们可以更进一步。如这个n < 0 ? yes : no可以用布尔代替:n < 0.
后缀条件适用于大多数的单行语句。如,@import, @charset, 混合书写等。当然,下面所示的属性也是可以的:
pad(types = margin padding, n = 5px) padding unit(n, px) if padding in types margin unit(n, px) if margin in types body pad() body pad(margin) body apply-mixins = true pad(padding, 10) if apply-mixins
生成为:
body {
  padding: 5px;
  margin: 5px;
}
body {
  margin: 5px;
}
body {
  padding: 10px;
}