Polymer 如何使用聚合物芯介质查询更改元素属性 公司名称

在上面的代码中，我有

水平起始对齐布局

，这意味着

核心工具栏中的元素

向左对齐

现在，当屏幕大小低于700px时，我想将

开始对齐

更改为

中心对齐

。如何使用

核心媒体查询

---

我们可以将代码包装到

中，还是必须创建自定义元素？

如果索引文件上有自动绑定模板，则无需在自定义元素中执行此操作。此外，polymer还可以使用

属性？=“{{value}}”

语法根据布尔值检查属性。在下面的例子中，

start justified？=“{{！queryMatches}}”

表示如果页面宽度超过700px，则queryMatches将为false，内容将左对齐。而

居中对齐？=“{{queryMatches}}”

意味着如果页面较小，则700px宽度的queryMatches将为真，并且内容将居中对齐

看起来像

<core-toolbar class="tall" horizontal start-justified layout>
 <div class="logo"><img src="assets/logo.png"></div>
 <h1 class="bottom">Company name</h1>     
</core-toolbar>

公司名称

它在这里工作

---

为完整性而编辑

这里最显著的技巧是，对于布尔属性，必须使用问号符号来绑定：

start justified？=“{value}}

。请将此添加到您的优秀答案中。非常感谢。thx到@mudasobwa。我只是想知道问号

<template is="auto-binding">
  <core-media-query query="max-width:700px" queryMatches="{{queryMatches}}"></core-media-query>
   <core-toolbar class="tall" horizontal start-justified?="{{!queryMatches}}" center-justified?="{{queryMatches}}" layout>
   <div class="logo"><img src="assets/logo.png"></div>
   <h1 class="bottom">Company name</h1>
  </core-toolbar>
</template>