在移动上加载不同的徽标

Question

我正在为一个慈善机构创建一个网站，但没有太多的经验。

如果您在桌面(https://walkministries.org.uk/newsite/)上查看网站，则该徽标在浅灰背景上是蓝色的。

但是，当您切换到移动，标志移动到一个不同的标题区域。在手机上，它会加载到蓝色背景上。这使标志消失，因为它是相同的颜色与背景颜色。

是否有方法为移动/响应加载不同版本的徽标？我有一个轻/白色的标志版本，这确实显示在粘性模式时，你滚动在手机上。当你第一次在你的移动设备上加载页面时，它不会加载那个徽标。

我似乎无法从主题创作者那里得到帮助。

谢谢!

我需要帮助的页面：https://walkministries.org.uk/newsite/

Answer 1

似乎你已经为移动视图选择了不正确的“灯光标志”。当我检查代码并注意到“轻型标志”实际上是黑暗的那个！用白色的标志代替它，它应该是很好的。

如果您不想玩主题设置，只需转到want >外观> Customizer > Custom，然后添加到下面并保存它。

@media(max-width: 1199px) {
    body.switchable-logo header#header .menuzord-brand .logo-light.logo-1x {
        display: none;
    }

    body.switchable-logo header#header .menuzord-brand .logo-dark.logo-2x.retina {
        display: block;
    }
}