如何使用html模板系统传递“css属性”

时间:2016-07-15 17:09:03

标签: html css nunjucks

我正在使用nunjucks构建一个组件库,有时我需要传递varialbes来更改例如背景图像,nunjucks不解析css文件,我最终设置内联样式如下:

包含组件并传递背景图片

{% set comp = { 'image': 'foo.jpg' } %}
{% include 'component.njk' %}

component.njk文件

<div class='comp' styles="background-image: url({{ comp.image }});"></div>

我可以把它放在里面&lt;风格&gt;组件内部的标签,但它不是html标准

这是无效的html:S

<style>.comp { background-image: url({{ comp.image }}); }</style>
<div class='comp' styles=""></div>

要解决此问题,我正在尝试在标头标记内附加组件样式标记。

是否有任何gulp插件? 有没有更好的解决方案?

我找到了一个cool "plugin" for nunjucks来附加来自子视图的代码,但它似乎过时了:S

Thansk这么多!

0 个答案:

没有答案