如何在小屏幕上隐藏标签?
P粉520204081
P粉520204081 2023-08-17 12:53:57
0
1
452
<p>我有一个带有标签和图标的 antd 菜单。 这是设计的最小表示。 Codesandbox</p> <p>现在我想要的是当菜单开始显示省略号时隐藏标签,只显示图标。由于我对 CSS 不太熟悉,我想知道是否可以通过 antd 来实现这个功能。</p>
P粉520204081
P粉520204081

Antworte allen(1)
P粉785905797

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

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

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

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

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!