如何在 0.5 中设置 Polymer 的 <core-scaffold> 工具栏背景样式?
How to style Polymer's <core-scaffold> toolbar background in 0.5?
我在尝试使用 core-scaffold 时在 Polymer 0.5 中设置工具栏的完整背景颜色时遇到问题。到目前为止,我在 Whosebug 上所做的尝试只设置了左侧菜单,而不是右侧内容。如何设置整个工具栏的背景颜色?
下面是他们自己示例中的代码示例。
<core-scaffold>
<core-header-panel navigation flex mode="seamed">
<core-toolbar>Menu</core-toolbar>
<core-menu>
<core-item icon="settings" label="item1"></core-item>
<core-item icon="settings" label="item2"></core-item>
</core-menu>
</core-header-panel>
<div tool>Dashboard</div>
<div class="content">Content goes here...</div>
<paper-toast id="error-toast" text="" swipeDisabled="false"></paper-toast>
</core-scaffold>
跨浏览器支持
感谢@CtrAltDel 引领我走向正确的方向。该解决方案仅适用于 IE。以下适用于 IE 和 Chrome.
<style>
body core-toolbar { background-color:Black; color:#ffffff; }
core-scaffold::shadow core-toolbar { background-color:Black; color:#ffffff; }
</style>
已经有一段时间了,但我过去有过这个工作:
body core-toolbar { background-color: #00FF00; }
使用您想使用的任何颜色作为背景颜色值。
我在尝试使用 core-scaffold 时在 Polymer 0.5 中设置工具栏的完整背景颜色时遇到问题。到目前为止,我在 Whosebug 上所做的尝试只设置了左侧菜单,而不是右侧内容。如何设置整个工具栏的背景颜色?
下面是他们自己示例中的代码示例。
<core-scaffold>
<core-header-panel navigation flex mode="seamed">
<core-toolbar>Menu</core-toolbar>
<core-menu>
<core-item icon="settings" label="item1"></core-item>
<core-item icon="settings" label="item2"></core-item>
</core-menu>
</core-header-panel>
<div tool>Dashboard</div>
<div class="content">Content goes here...</div>
<paper-toast id="error-toast" text="" swipeDisabled="false"></paper-toast>
</core-scaffold>
跨浏览器支持
感谢@CtrAltDel 引领我走向正确的方向。该解决方案仅适用于 IE。以下适用于 IE 和 Chrome.
<style>
body core-toolbar { background-color:Black; color:#ffffff; }
core-scaffold::shadow core-toolbar { background-color:Black; color:#ffffff; }
</style>
已经有一段时间了,但我过去有过这个工作:
body core-toolbar { background-color: #00FF00; }
使用您想使用的任何颜色作为背景颜色值。