javascript - 如何更改 Material-UI Card header front?

标签 javascript html css reactjs material-ui

我目前有一个 Material-UI 卡片标题,其背景颜色使默认字体难以阅读。我想让 header 使用排版 Prop h4 但很难找到成功。

enter image description here

const styles = {

    cardHeader: {
        backgroundColor: "#d8e2f3",
        MuiTypography: {
            fontVariant: "h4"
        }
    }
};

最佳答案

首先,一定要找好官方文档material ui card header api

我猜你可能想使用 .MuiCardHeader-title (.MuiCardHeader-root)

在浏览器中打开开发模式,鼠标悬停选择DOM,可以看到相关的类名,您可以在浏览器中更改其样式来检查您操作的DOM是否符合您的需求。

并如下定义类样式(MUI-datatable 的示例,它是来自 Material-UI 表的库)

MuiPaper: {
  root: {
    borderRadius: '0 !important',
  }
},
MUIDataTable: {
  root: {
  },
  tableRoot: {
  },
},
MUIDataTableToolbar: {
  root: {
    display: 'none',
  }
},

希望对您有所帮助。

关于javascript - 如何更改 Material-UI Card header front?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59381036/

相关文章:

javascript - 如何保存使用javascript动态创建的html表单

javascript - 为什么 >=(大于或等于)比较在 Javascript 中不起作用?

html - 如何使用 Nokogiri 解析 TABLE 文本?

javascript - iOS 奇怪的链接行为

JavaScript:添加到关联数组

javascript - 如何使用python获取链接内元素的文本

html - 如何设置 iframe 最小高度,使其从页眉到页脚或更长?

html - 第二个内容 div 填充剩余高度,其中第一个内容 div 具有可变高度

jQuery Slide to left right on a spitted Page

javascript - 动态创建 DOM 对象并赋予类