gpt4 book ai didi

javascript - 在移动设备或桌面上使用不同的导航栏样式

转载 作者:行者123 更新时间:2023-11-28 04:18:51 25 4
gpt4 key购买 nike

有没有办法根据视口(viewport)更改导航栏?

例如,当您的视口(viewport)为 1024x768 时,您将显示第一个导航栏,该导航栏是为桌面尺寸和更多尺寸构建的,但如果您的视口(viewport)低于该尺寸分辨率,显示“适合移动设备”的导航栏。

最佳答案

您可以使用媒体查询:

在 CSS 中:

@media (min-width:768px) and (min-height:1024px) {
/*Desktop css*/
}
@media (max-width:768px) and (max-height:1024px) {
/*Mobile css*/
}

或使用外部样式表:

<link rel="stylesheet" media="(min-width:768px) and (min-height:1024px)" href="desktop.css">
<link rel="stylesheet" media="(max-width:768px) and (max-height:1024px)" href="mobile.css">

关于javascript - 在移动设备或桌面上使用不同的导航栏样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42323311/

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