【AntD】修改可折叠侧边菜单宽度

最新推荐文章于 2024-10-12 10:37:34 发布

不好意思高到你

最新推荐文章于 2024-10-12 10:37:34 发布

阅读量1k

点赞数 1

文章标签： sass react.js css Powered by 金山文档

本文链接：https://blog.csdn.net/weixin_40476977/article/details/129620811

版权

该文关注于前端开发中使用ant-design框架时，对布局组件sider的宽度进行动态调整。在未折叠状态下，sider宽度设定为210px，而折叠后则变为70px。这些设置涉及到CSS的flex属性及max-width、min-width和width的使用，以实现侧边栏的展开与收起效果。

摘要由CSDN通过智能技术生成

需要修改覆盖两个，分别是折叠前后

:global(.ant-layout-sider) {
  flex: 0 0 210px !important;
  max-width: 210px !important;
  min-width: 210px !important;
  width: 210px !important;
}
:global(.ant-layout-sider-collapsed) {
  flex: 0 0 70px !important;
  max-width: 70px !important;
  min-width: 70px !important;
  width: 70px !important;
}