css - material-ui 表单标签位置

Question

Material-ui用+制作表格react。有没有办法将标签布局到输入字段的一侧？它更具可读性。

像这样：

name   [input]
title  [input]

而不是

name  
[input]
title 
[input]

我只能找到标签和输入区域混合在一起的字段。我可以构建自己的组件或网格，但似乎这是一个应该存在的明显布局。

文档页面 https://material-ui.com/components/text-fields/

标签： cssreactjsformsmaterial-uiformik-material-ui

Answer 1

我遇到了同样的问题，我发现解决问题的唯一方法是使用“ sx ”，它允许您覆盖 CSS。

<InputLabel htmlFor="login" sx={{display: 'inline'}}>Login :</InputLabel>
<Input  id="login" type="text" value={login} onInput={ e=>setLogin(e.target.value)} />