帮助Sass mixin&变量(var被忽略)

时间:2009-10-21 16:16:12

标签: css haml sass compass-sass

我在下面的部分中有以下mixin:

=card-list
  width: 180px
  min-height: 150px
  display: -moz-inline-stack
  display: inline-block
  vertical-align: top
  margin: 5px
  zoom: 1
  *display: inline
  _height: 250px
  -moz-border-radius: 10px
  -webkit-border-radius: 10px

现在,当我尝试将其参数化并添加一些变量时,它们会被忽略:

=card-list(!width=180px)
  width: !width
  min-height: 150px
  display: -moz-inline-stack
  display: inline-block
  vertical-align: top
  margin: 5px
  zoom: 1
  *display: inline
  _height: 250px
  -moz-border-radius: 10px
  -webkit-border-radius: 10px

我正在使用它:

#content
  ul.characters > li
    +card-list(180px)
    background-color: black
    border: 1px solid black

问题在于,当我使用mixin的参数化版本时,忽略width属性,它甚至不会出现在CSS中。你能发现这段代码上的任何错误吗?

如果我使用mixin的NOT参数化版本,一切正常。

1 个答案:

答案 0 :(得分:3)

如果您在属性中使用变量,则需要使用=,而不是:

=card-list($width: 180px)
  width = $width
  min-height: 150px
  display: -moz-inline-stack
  display: inline-block
  vertical-align: top
  margin: 5px
  zoom: 1
  *display: inline
  _height: 250px
  -moz-border-radius: 10px
  -webkit-border-radius: 10px