更改material-ui按钮的字体大小，并使按钮缩放？ [英] changing font size of material-ui buttons, and having the buttons scale?

问题描述

我似乎在更改Material-UI（对于React）RaisedButton上的字体大小时遇到​​问题，并且按钮本身也能正确缩放。

I seem to be having an issue with changing the font sizes on Material-UI's (for React) RaisedButton and having the button itself scale properly with it.

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

CSS：

.buttonText {
    font-size: 63px;
}

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

The text size changes but the button itself doesn't scale with it. Does anyone know the proper solution to this? I want to button to scale with the text size.

推荐答案

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

The problem is Material-UI inlines all of the styles for their components, so if you try to override them with CSS selectors it doesn't usually work quite right. Instead, try overriding whatever inline styles you don't want using the style property directly on the component. It would look something like this:

< RaisedButton style = {{fontSize：'63px'}} label ='登录这里'/ >

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

And if it still doesn't look quite right, just inspect all the generated inline styles on that component and see what you'd like to change, then just add that to the style object as well.

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

这篇关于更改material-ui按钮的字体大小，并使按钮缩放？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！