加载时，移动菜单会在桌面屏幕上短暂显示答案

【问题标题】：Mobile menu shows up briefly on desktop screen on loading加载时，移动菜单会在桌面屏幕上短暂显示
【发布时间】：2016-05-26 10:57:16
【问题描述】：

首先，我的设计是响应式的。

我使用 2 种不同的菜单，一种用于移动尺寸的屏幕，另一种用于桌面 (>768px) 尺寸的屏幕。

如果我使用桌面访问我的页面，移动菜单会短暂显示并消失。如果您访问该页面，它看起来有点糟糕。

我的css代码：

.menu_right{
    float: left;
    margin-left: 10px;
    width: 215px;
}


@media screen and (max-width: 768px) {
    .menu_right {
        display: none;
        max-width: 100%;
    }
}

有解决这个问题的办法吗？

最好的问候

【问题讨论】：

你能给我们展示一个演示或分享到现场网站的链接吗？
您需要此菜单 .menu_right 在桌面上可见或隐藏，换句话说，这是移动菜单还是桌面菜单？

标签： html css

【解决方案1】：

您可以将 .menu_right 设置为不显示，然后使用媒体查询仅针对需要它的屏幕尺寸显示它：

.menu_right{
 float:left;
 margin-left:10px;
 width:215px;
 display: none;
}

@media screen and (max-width: 768px) {
 .menu_right{
  display: block;
 }
}

【讨论】：