javascript - Material-UI:如何制作对齐表单

标签 javascript html css reactjs material-ui

我是 Material-UI 新手。通常如何构建一个表单,其中一些字段水平分组,而其他字段垂直堆叠,并且所有字段在垂直和水平方向上都很好地对齐?请参阅以下示例图片:

enter image description here

我知道如何使用纯 HTML 表格构建这种表单,但是“正确的”Material-UI 方式是什么?示例代码会很好。

最佳答案

这里有前两行的示例:

<form>
<Grid container>
  <Grid item xs="12">
    <TextField id="standard-basic" label="Standard"/>
  </Grid>
</Grid>

<Grid container>
  <Grid item xs="8">
    <TextField id="standard-basic" label="Standard"/>
  </Grid>
  <Grid item xs="4">
    <TextField id="standard-basic" label="Standard"/>
  </Grid>
</Grid>
</form>

关于javascript - Material-UI:如何制作对齐表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59321614/

相关文章:

javascript - 使用 iframe 下载文件

html - 窗口高度调整大小后覆盖不全屏

javascript - Internet Explorer <视频> 更改来源

javascript - 在 Tampermonkey 中导入库(通过@require)时出错

javascript - 如何从日期选择器验证行中的 3 个日期

javascript - 一种输入 - 两种风格?左侧光标 :text, 右侧光标 :pointer?

html - 使用 php-mysql-html [无 jQuery] 加载更像 facebook 或旧的 twitter

css - 使 Bootstrap 导航栏页脚停留在页面或屏幕的底部

css - 容器 Bootstrap 的链接按钮全高

javascript - jQuery 单击事件在第一次单击时不起作用