Ubermenu 移动分辨率

Question

我正在使用 ubermenu，我的菜单项是图像。 我的问题是当我使用移动分辨率访问网站时，我的菜单项保持不变，这真的很大。 我不想使用响应式菜单，当我使用不同的分辨率时，如何让我的菜单伸展？

Answer 1

除了您“不想使用响应式菜单”这一事实之外，我看不到其他方法（除了通过 css 以固定宽度值“手动”缩小图像）。

所以对于响应式解决方案：通过使用以下代码

.theimagesclass {
    display: block;
    max-width: 100%;
    height: auto;
}

（从 Bootstrap 获得），您可以使这些图像具有响应性，从而使它们在较小的设备上更小。

如果图像在较大的设备上表现异常，您可以为较低的分辨率添加媒体查询，例如：

@media screen and (max-width:767px){
    .navclass img {
        display: block;
        max-width: 100%;
        height: auto;
    }
}

如果屏幕分辨率低于 768 像素，这只是针对 .navclass 元素内的图像。