Material 设计表格

Question

我正在研究 Material 设计和 material 设计中描述的一些指南。

我似乎遗漏了一个部分（不确定是否应该涵盖），是 Google 如何处理字段集。该文档确实涵盖了各个输入，但从未研究过 Fieldset。

我经常看到的一种方法是将表单显示在单个卡片上。其他方法更喜欢将它放在简单的标准背景上。

最"Material Design" 呈现字段集的方式是什么？我知道没有对错之分，但理论上应该有一个正确的做法。

Answer 1

似乎预期的做法可能是使用 Steppers 对表单进行逻辑分组。根据您的实施，这可能很难做到。

我使用的替代方案是带有 lists/dividers 的卡片，例如在 Angular Material something like this 中。如果过度，它可能会在移动设备上变得笨拙。

<md-card style="max-width: 500px;">
    <md-card-content md-padding>
        <p class="md-heading">Title</p>
        ...content...
    </md-card-content>
    <md-divider></md-divider>
    <md-card-content md-padding>
    </md-card-content>
</md-card>

Material 设计表格

Material Design Forms

materialized

material-design

angular-material