javascript - polymer 改变墨水波纹颜色

Question

总的来说，我对 polymer 和 webdev 还很陌生。我完成了 polymer 教程，我想做的一件事是更改纸标签中的墨水波纹颜色。在文档中它说

paper-tabs.pink paper-tab::shadow #ink { color: #ff4081; }

但我不知道我应该把它放在哪里，我试着查看 paper-tabs.html 源代码和相关的 css 文件，将那一行放在其中一个似乎不起作用。我还为我的 index.html 创建了一个单独的 .css 文件，其中包含这一行，但这也不起作用。

我知道这可能真的很简单，但我花了很多时间试图弄明白。感谢您的帮助。

Answer 1

如果您愿意，您可以将样式放入您自己的 CSS 文件中。 ::shadow 和 /deep/ 选择器让您穿透元素的阴影边界，以便您可以设置其内部样式。

例如:

<style shim-shadowdom>
  paper-tabs /deep/ #ink {
    color: red;
  }
</style>

Here it is on jsbin

因为我的 CSS 出现在 polymer 元素之外，所以我需要包含 shim-shadowdom 属性来告诉 polyfill 在不支持 Shadow DOM 的浏览器中生效。