如何调整移动端访问时的网站Logo尺寸

以下是可直接落地的排查和修改步骤：

• 优先确认CSS选择器匹配：在移动端访问页面后，右键点击Logo选择「检查」，在弹出的开发者工具中复制Logo元素的准确class或id（常见标识为.site-logo、#custom-logo、.header-logo img等）
• 编写高优先级移动端适配规则，直接粘贴到主题后台「自定义-额外CSS」板块即可：

/* 适配768px以下宽度的移动设备，可根据需求调整断点数值 */
@media only screen and (max-width: 768px) {
  /* 将下方选择器替换为你复制的Logo元素选择器 */
  .site-logo img {
    /* 按需选择固定尺寸或比例尺寸即可 */
    width: 120px !important;
    /* width: 75% !important; */
    height: auto !important;
  }
}

• 强制清缓存验证效果：修改后依次清空网站缓存插件缓存、手机浏览器本地缓存、CDN资源缓存（如有配置），用浏览器无痕模式访问页面确认是否生效。
• 异常排查：如果规则仍未加载，检查媒体查询是否存在语法错误（比如漏写花括号、max-width属性漏加px单位）、选择器拼写是否和实际元素匹配即可。

内容的提问来源于stack exchange，提问作者Jay Nove