如何解决重大UI媒体查询未使用正确的CSS
我在Material UI中传递了一个悬停在makeStyles上的属性,该属性将相应地更改元素样式。只要它不在指定的断点内,它就会按预期工作,然后就开始使用假值。是否可以使其在[theme.breakpoints]内部工作?
const markerStyle = makeStyles((theme: Theme) => ({
container: (props: any) => ({
position: 'absolute',display: 'flex',justifyContent: 'center',alignItems: 'center',height: props.hovered ? '34px': '30px',width: props.hovered ? '34px': '30px',borderRadius: '50% 50% 50% 0',transform: 'rotate(-45deg)',top: props.hovered ? '-37px': '-33px',fontSize: '1rem',left: `calc(${props.hovered ? '-17px': '-15px'} + ${props.left}%)`,[theme.breakpoints.up('xl')]: {
left: `calc(${props.hovered ? '-25px': '-23px'} + ${props.left}%)`,top: props.hovered ? '-53px': '-49px',height: props.hovered ? '50px': '46px',width: props.hovered ? '50px': '46px',fontSize: '1.5rem'
}
}),}));
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。