无法在 Safari 中设置元素内容(content：：content)的样式，在 Chrome 中工作正常

Question

在Chrome和Safari中都可以看到http://mycommunity.org。(这是后dart2js)

单击右上方的创建按钮，注意对话框中的元素在Chrome中是如何样式的，但在Safari中不是。

在Safari我不能得到的东西样式!

这是什么工作在Chrome:

content::content h1 {
  margin: 0 0 15px 0;
  color: #334C80;
}

它不工作在Safari，即使当我做这样的事情:

core-overlay::content h1 {
  color: orange;
}

这是它在代码中的存在方式(链接):

<link rel="import" href="../../../../../../../packages/polymer/polymer.html">
<link rel="import" href="../../../../../../../packages/core_elements/core_overlay.html">
<polymer-element name="x-dialog">
  <template>
    <link rel="stylesheet" href="dialog.css">
    <core-overlay id="overlay" layered backdrop opened="{{opened}}" autoCloseDisabled="{{autoCloseDisabled}}"  transition="core-transition-center">
      <content></content>
    </core-overlay>
  </template>
  <script type="application/dart" src="dialog.dart"></script>
</polymer-element>

Answer 1

谢谢@ebidel。答案确实是:

polyfill-next-selector { content: ':host h1'; }
::content h1 {
  color: red;
}

http://www.polymer-project.org/docs/polymer/styling.html指示

我认为文档可以更简单，比如"当你想做X时，使用Y"。即使在阅读了样式指南之后，我也不知道我想要polyfill-*选择器