在Jade模板中编写内联CSS样式时，如何使用javascript变量

Question

我正在尝试动态插入CSS代码段。理想情况下，这可行：

style(type='text/css')
    #header a#logo { background:url(constants.logo) no-repeat; }
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
        #header a#logo { background-image: url(constants.logo_2x); }
    }

不幸的是，constants.logo /字面/放在DOM中。工作如下：

!= "<style type='text/css'>"
!= "#header a#logo { background:url('"+constants.logo+"') no-repeat; }"
!= "@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {"
!= "    #header a#logo { background-image: url('"+constants.logo_2x+"'); }"
!= "}</style>"

有更好的方法吗？

Answer 1

使用#{variable}在元素的文本中打印变量。