大卡特尔Roadie主题-增加手机上的徽标大小

Question

我想增加标题徽标的大小，仅用于手机视图。当我尝试在测试站点上调整CSS时，整个程序崩溃了。我更改了这些最大高度数字：

我看到了移动代码中的计算-更改数字可能会破坏这一点吗？

@media screen and (max-width: 767px) {

    .header-home-link.has-logo {
        height: auto;
        max-height: 64px;
    }
}

@media screen and (min-width: 320px) {
    .header-home-link.has-logo {
        height: auto;
        max-height: 50px;
    }
}

Answer 1

从您的问题来看，似乎您正在编辑现有代码，因此可能还有我不知道的其他因素。但是，当前设置的工作原理是使每个大于320px的宽度将高度设置为50px，每个小于700px的宽度的徽标高度为64px。这种矛盾可能导致了一些问题，但是，我知道chrome优先考虑了代码稍后的规则，因此在徽标高度为64px的320px以下创建了一个窗口。为了获得更清洁的解决方案，我建议您在主CSS中将徽标的高度设置为不带媒体规则的其他所有屏幕，并为徽标的高度添加宽度为500px左右的max-width媒体规则。

还有一个特殊的原因为什么您选择设置最大高度，然后将高度设置为自动，而不是直接更改图像的高度，然后根据需要将宽度设置为自动？ >

如果您仍然遇到问题，我还建议您尝试使用您知道可以使用的简单语句测试代码的各个方面，以找出问题所在。