使用:sass过滤器:css

cor*_*ded 2 css haml sass

我们目前正在制作一个需要一些默认声明样式的小部件(小部件html包含在javasacript中,以及样式标签中的默认css)但问题是我无法"链接"haml过滤器.

我想要做的是添加内部样式表以及小部件,如下所示:

<style type="text/css">
  p {color: #f00;}
</style>

<div id="widget-goes-here">
   <p>etc</p>
</div>
Run Code Online (Sandbox Code Playgroud)

我们正在使用haml所以我尝试使用sass过滤器:

:sass
  p
    :color #f00

#widget-goes-here
  %p etc
Run Code Online (Sandbox Code Playgroud)

遗憾的是,它只是生成了一个带有ap的div加上生成的css代码字面上:

p {color: #f00;}

paragraph here
Run Code Online (Sandbox Code Playgroud)

然后我尝试使用haml的css过滤器将事物封装在样式标签中(理论上它应该将段落文本颜色变为红色):

:css
  :sass
    p
      :color #f00

#widget-goes-here
  %p etc
Run Code Online (Sandbox Code Playgroud)

但这也失败了,它确实生成了样式标签但是它只是包含了单词:sass p:color#f00 in it(它没有解析sass代码)

我们确实改变了它

 :css
   p {color: #f00}
Run Code Online (Sandbox Code Playgroud)

并且它运行良好,但我仍然计划在sass中进行样式(而不是普通的旧css)有没有办法做到这一点?

cor*_*ded 10

也在haml小组中发布了这个回复:

你不能嵌套过滤器.

你想要这个sass:

%style{:type => "text/css"}
  :sass 
    div 
      color: red 
Run Code Online (Sandbox Code Playgroud)

哦,如果嵌套它可能会更漂亮.