如何在小屏幕上隐藏标签？

Question

我有一个带有标签和图标的antd菜单。这是设计的最小表示。Codesandbox现在我想要的是当菜单开始显示省略号时隐藏标签，只显示图标。由于我对CSS不太熟悉，我想知道是否可以通过antd来实现这个功能。

P粉785905797 · Answer

您需要使用媒体查询，并在特定尺寸以下将标签设置为display none。

@media only screen and (max-width : 768px) {
    span.ant-menu-title-content {
    display: none;
    }
}

我个人建议您使用上面这个（它是在桌面和移动设备之间切换最常用的方法）

最后，请考虑使用justify-content: center来在移动设备上将菜单项居中显示 :)