小编典典

更改Material-ui按钮的字体大小,并使按钮缩放?

reactjs

我似乎在更改Material-UI(用于React)的RaisedButton的字体大小以及使按钮本身正确缩放时遇到问题。

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

CSS:

.buttonText {
    font-size: 63px;
}

文字大小会改变,但按钮本身不会随之缩放。有谁知道正确的解决方案?我想按比例缩放以适应文本大小。


阅读 568

收藏
2020-07-22

共1个答案

小编典典

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

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

如果看起来仍然不太正确,只需检查该组件上所有已生成的内联样式,然后查看要更改的内容,然后将其也添加到style对象中即可。

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

2020-07-22