javascript - 改变 material-ui 按钮的字体大小，并让按钮缩放？

Question

我似乎在更改 Material-UI 的(用于 React)RaisedButton 上的字体大小以及让按钮本身随它适当缩放方面遇到了问题。

<RaisedButton
label={<span className="buttonText">Log in Here</span>}
/>

CSS:

.buttonText {
    font-size: 63px;
}

文本大小发生变化，但按钮本身不会随之缩放。有谁知道正确的解决方案？我想按文本大小缩放按钮。

Answer 1

问题是 Material-UI 内联了它们组件的所有样式，因此如果您尝试使用 CSS 选择器覆盖它们，它通常无法正常工作。相反，请尝试使用 style 覆盖您不想要的任何内联样式。属性直接在组件上。它看起来像这样:

<RaisedButton style={{ fontSize: '63px' }} label='Log in Here' />

如果它看起来仍然不太正确，只需检查该组件上所有生成的内联样式并查看您想要更改的内容，然后将其添加到 style对象也是如此。

http://www.material-ui.com/#/components/raised-button