Material UI 内联样式 - 特定的组件颜色 [英] Material UI inline styling - specific component colours

问题描述

我正在尝试通过Material-UI设置TextField的样式.我的背景是黑色，我需要textField边框和文本都是白色的.这是我的(相关)代码:

I'm trying to style my TextFields from Material-UI. I have a black background and I need both the textField border and text to be white. Here's my (relevant) code:

render() {
    const styles = {
      width: {
        width: '90%',
        margin: '5px',
        padding: '5px',
        textColor: '#ffffff',
        hintColor: '#ffffff',
        floatingLabelColor: '#ffffff',
        disabledTextColor: '#673ab7',
        focusColor: '#c2185b',
        borderColor: '#ffffff'
      },
      button: {
        margin: '15px',
        padding: '20px',
        width: '60%'
      }
    };

<TextField
              className="classes.textField"
              label="Name Your Vice"
              type="text"
              name="vice"
              value={this.props.vice}
              margin="normal"
              variant="outlined"
              style={styles.width}
              onChange={this.props.handleInputChange}
            />

要使它正常工作，我缺少什么?

What am I missing to get this to work?

谢谢

推荐答案

我发现Material UI需要深入挖掘组件以进行非常基本的更改.相反，我使用了Materialize(Material UI的更友好版本)，发现自定义组件相对简单.

I found that Material UI required a lot of digging down into the components to make very basic changes. I instead used Materialize (a more friendly version of Material UI) and found it relatively simple to customise my components.

这篇关于Material UI 内联样式 - 特定的组件颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！