gpt4 book ai didi

reactjs - 如何设置 Material-UI Tabs 组件的高度?

转载 作者:行者123 更新时间:2023-12-03 14:28:44 27 4
gpt4 key购买 nike

我正在尝试设置 Material-UI Tabs component 的高度至 32 像素。我知道这不是一个很好的用户体验想法,但是,我已经解释过这一点,而且客户仍然想要它。

我尝试设置选项卡组件本身的高度。然后放在里面的Tab组件上。后者将高度固定为 32px,但标签太低,因为有一个内部 div(仍然)设置为 48px。

source 中的行看起来是:

height: (props.label && props.icon) ? 72 : 48,

我不知道如何使用通过 Material-UI 公开的样式和主题来覆盖内部 div。

最佳答案

const tabHeight = '24px' // default: '48px'
const useStyles = makeStyles(theme => ({
tabsRoot: {
minHeight: tabHeight,
height: tabHeight
},
tabRoot: {
minHeight: tabHeight,
height: tabHeight

}
}));

<Tabs
classes={{
root: classes.tabsRoot,
}}>
<Tab
classes={{
root: classes.tabRoot
}} />
<Tab
classes={{
root: classes.tabRoot
}} />
<Tab
classes={{
root: classes.tabRoot
}} />
</Tabs

基于“自定义组件”选项 1 的技术:Overriding styles with classes

关于reactjs - 如何设置 Material-UI Tabs 组件的高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39777023/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com