时间戳

首页 > 解决方案 > 我们如何在材质 ui 元素中应用 css 属性？

javascript - 我们如何在材质 ui 元素中应用 css 属性？

问题描述

我刚开始使用材料 ui，我不明白间距属性是如何工作的。我正在检查如何对某些元素使用“间距”功能，但老实说，它似乎只适用于“盒子”组件，而不适用于“按钮”之类的东西。

根据材料 ui 间距部分，如果我们想添加边距或填充，我们可以使用m，或者p但如果您尝试将这些属性用作Button组件的一部分，则它不起作用：

<Button variant="contained" color="primary" mt={2}>
  Primary
</Button>

如您所见，我正在使用mt(margin-top property) 并根据文档所说的，这应该适用：margin-top: 8px但它没有设置任何东西......

所以，我的问题是，我们可以在材质ui中使用间距属性的元素是什么？在我的例子中我做错了什么？

标签： javascriptcssreactjsmaterial-ui

解决方案

您必须将 Button 包装在 Box 组件中才能应用这样的间距属性

<Box mt={2} color="primary" clone>
<Button variant="contained">
  Primary
</Button>
</Box>

因为 Button 组件默认不接收这些间距属性。

推荐阅读