我想制作我的样式 dom-module
,并且因为我喜欢使用 @apply
css 指令,所以我希望我可以做类似的事情:
<dom-module id="my-styles">
<template>
<style>
html {
--big-title: {
font-size: 1.3em;
text-transform: UPPERCASE;
}
}
</style>
</template>>
</dom-module>
但如果我这样做:
<dom-module id="my-element">
<template>
<style include="my-styles">
h1 {
@apply --big-title;
}
</style>
...
</template>
</dom-module>
很遗憾,这行不通。我不确定为什么。我的问题是我可以将 @apply 指令与样式 dom-module
解决方案结合使用吗?
最佳答案
我会说,您应该将您的属性分配给 :host
。
检查这个例子: http://jsbin.com/dikacewulu/2/edit?html,output
这里,:host
指的是包含样式的元素(所以my-element
)。如果您真的希望这些规则在 html
上可用,您可以使用 :root
。
关于css - @apply 和样式 dom 模块在 Polymer 2.0 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44866315/