在本地化的Polymer 1.0应用程序中,我将顶级元素dir设置为“ rtl”:

<html dir="rtl">
  ...
</html>


在自定义元素中,我想根据方向更改位置,所以我想要一个CSS规则,例如

<style>
  html[dir="rtl"] #SomeSubElement { .... }
</style>


但是,通过这样做,Polymer将规则重命名为类似

html[dir="rtl"].my-custom-element #SomeSubElement.my-custom-element { ... }


这样可以防止CSS规则每次应用。有没有一种方法可以避免对CSS规则的某些部分(即html [dir =“ rtl”]应该全局应用的部分)进行范围界定?

谢谢!

最佳答案

我找到了正确的解决方案:

:host-context(html[dir="rtl"]) {
   ...
 }


this guide on shadow DOM in Polymer中对此进行了更详细的介绍。

关于css - 在Polymer 1.0中使用HTML方向支持RTL的CSS样式,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/33765656/

10-09 15:00
查看更多