如何在react.js中的Material UI中更改DialogTitle和DialogContent中的字体颜色 [英] How to I change font color in DialogTitle and DialogContent in Material UI in react.js

问题描述

如何在react.js的Material UI中的 DialogTitle 和 DialogContent 中更改字体/文本颜色

How to I change font/text color in DialogTitle and DialogContent in Material UI in react.js

更改 Dialog 的背景颜色有效，但是尝试更改Dialog和DialogContent的字体颜色无效.

Changing background color for Dialog works but trying to change font color for Dialog and DialogContent doesn't work..

<Dialog
    open={this.state.open}
    aria-labelledby="alert-dialog-title"
    aria-describedby="alert-dialog-description"
    PaperProps={{
       style: {
           backgroundColor: "#fff",
       },
    }}
    >

    <DialogTitle id="alert-dialog-title">
         "Use Google's location service?"
    </DialogTitle>

    <DialogContent>
         <DialogContentText id="alert-dialog-description">
              Hello 
         </DialogContentText>
    </DialogContent>

    <DialogActions>
         <Button onClick={this.handleClose} color="primary">
                OK
         </Button>
    </DialogActions>
</Dialog>

推荐答案

覆盖DialogTitle'root'类:

Overide DialogTitle 'root' class:

root: {
    backgroundColor: theme.palette.primary.main,
    '& h6': {
      color: 'red'
    }
  }

如果要更改所有对话框，请通过覆盖主题全局进行此操作:

If you want to have all dialogs changed, then do this globally by overriding theme:

MuiDialogTitle: {
      root: {
        backgroundColor: theme.palette.primary.main,
        '& h6': {
          color: 'red'
        }
      }
    }

这篇关于如何在react.js中的Material UI中更改DialogTitle和DialogContent中的字体颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！