在 Polymer Dart 中，如何构建一个 CSS table，使用 1 个聚合物元素作为 table，另一个用于行和单元格

Question

我的目标是使用 CSS（显示：table、table-行、table-单元格）和 1 个自定义构建一个 table为 table 定义 div 的聚合物元素，以及为行和单元格定义 div 的另一个聚合物元素，像这样

<my-table>
  <my-row col1="contents of column 1" col2="column 2">
      --html for content of column 3--  
  </my-row>
</my-table>

我遇到的问题是 "display:table;" 创建的 div 没有被 "display:table-row" 创建的 div 识别和 "display:table-cell"。 div创建的divs似乎认为它们是自己的individual tables.

有没有办法让它工作？如果答案是使用 ::content ::shadow，那么我需要向我展示如何使用它，因为我无法让它工作并表现得像一个大的 table.

Answer 1

您应该设置聚合物元素的 host 样式，而不是其中的 div。

In Polymer Dart, how to build a CSS table using 1 polymer-element for the table and another for the rows and cells