顶部Logo修改需直接编辑HTML中layui-logo容器内容，支持纯文字、图片或带链接的图片，并同步检查CSS样式、图片路径有效性及移动端适配问题。
顶部 Logo 修改不是改某个配置项，而是直接改 HTML 结构里的 <div class="layui-logo"> 内容，同时注意配套的 CSS 样式和图片路径是否有效。
找到并替换 <div class="layui-logo"> 里的内容
在你的主 HTML 文件（通常是 index.html）中，搜索 layui-logo。常见结构如下：
<div class="layui-header"> <div class="layui-logo">后台管理系统</div> <!-- 其他导航 --> </div>
这里可以直接替换成文字、带链接的文字，或 <img> 标签：
- 纯文字：把
后台管理系统换成你自己的系统名，比如EASY 后台 - 图片 Logo：
<img src="./static/images/logo.png" alt="Logo" height="30">，注意src路径要真实存在且可访问 - 带跳转链接：
<a href="/" class="layui-logo"><img src="..."></a>，此时建议移除原div的 class 或重写样式，避免默认居中/行高干扰
检查并覆盖可能影响显示的 CSS
部分模板会用 CSS 强制设置 .layui-logo 的高度、行高或背景图，导致你插入的 <img> 被裁剪或不显示。重点关注以下几类规则：
-
.layui-logo { line-height: 60px; }→ 图片高度若小于 60px，会被垂直拉伸或遮挡，建议设为line-height: normal;或用display: flex; align-items: center; -
.layui-logo img { max-height: 100%; }→ 可能限制图片尺寸，可加height: 30px; vertical-align: middle;显式控制 - 有背景图声明：
.layui-logo { background: url(...) no-repeat; }→ 这会盖住你写的<img>，必须删掉或background: none;
注意移动端适配和隐藏逻辑
有些模板为响应式做了 layui-hide-xs、layui-show-sm-inline-block 等类，会导致 Logo 在小屏消失或错位：
- 检查
<div class="layui-logo">是否被套了类似layui-hide-xs的类，删掉即可 - 如果用了
<img>但小屏下不显示，可能是父容器width或overflow限制，可临时加style="max-width: 100%; height: auto;"测试 - 某些模板把 Logo 和右侧用户菜单写在同一行，
flex布局下图片过宽会挤掉其他元素，建议用flex-shrink: 0;锁定 Logo 宽度
真正卡住人的往往不是改哪一行代码，而是改完后图片 404、文字被行高截断、或者只在桌面显示——务必打开浏览器开发者工具，选中 Logo 元素，看 computed styles 和 network 请求，确认图片加载成功、CSS 没被意外覆盖。
