图片不居中需设置父容器text-align:center或图片自身margin:0 auto+display:block；避免使用已废弃的align属性；优先用具体CSS选择器覆盖SeedProd默认样式；删除width/height内联属性，改用max-width:100%;height:auto;确保Layout Mode为Block。
SeedProd 维护页里图片不居中？检查 align 属性和容器宽度
html 的 <img> 标签本身不响应 align（已废弃），在 seedprod 里直接写 <img align="center"> 没用。真正起作用的是 css 层级：图片父容器是否设了 text-align: center，或者图片自身是否用了 margin: 0 auto + display: block。
SeedProd 默认编辑器生成的图片常套在 <p> 或 <div> 里，但这些容器默认是左对齐、无宽度限制的。你看到“图片靠左”，往往不是图片问题，而是它没被框住。
- 手动在 SeedProd 的「自定义 HTML」区块里包一层带样式的
<div style="text-align: center;"> - 如果用的是 SeedProd 的「Image」模块，进模块设置 → 找「Alignment」选项（不是 HTML 属性），选「Center」——这个才真正生效
- 避免用旧式
align="middle"或hspace/vspace，SeedProd 渲染时可能忽略或报错Invalid HTML attribute
用 CSS 覆盖 SeedProd 默认样式时，!important 不是万能解
SeedProd 主题自带的 CSS 优先级很高，比如它给 .sp-image 类加了 float: left，光写 margin: 0 auto 压不住。这时候得看浏览器开发者工具里，哪条规则被划掉了、为什么被覆盖。
常见误操作是加一堆 !important，结果导致后续调试混乱，甚至影响移动端响应式排版。
- 优先用更具体的 CSS 选择器，比如
.sp-maintenance-page .sp-image，而不是泛泛的img - 只在必要处加
!important，例如：margin: 0 auto !important;，但别给width或max-width也加，否则图片在手机上可能溢出 - SeedProd 的「Custom CSS」入口在后台 → SeedProd → Pages → 编辑页面 → Settings → Custom CSS，粘贴后记得点保存并清缓存
图片宽高比失真？width 和 height 属性别乱设
SeedProd 的维护页默认适配移动设备，如果你在 HTML 中硬写 <img width="800" height="400">，图片在手机上会被强制拉伸或裁剪，看起来糊、变形、甚至错位。
立即学习“前端免费学习笔记（深入）”；
它本质是把响应式布局搞成了固定像素思维。SeedProd 内部用的是 Flex/Grid + max-width: 100%，你插进去的内联宽高会直接冲突。
- 删掉所有
width/height属性，让图片自然按容器缩放 - 需要控制大小？改用 CSS：
max-width: 100%; height: auto;—— 这才是响应式安全写法 - 如果图必须等比缩放到某个最大宽度（比如 600px），用：
max-width: 600px; width: 100%; height: auto;
上传图片后位置飘移？检查 SeedProd 的「Layout Mode」和图片加载时机
SeedProd 提供两种布局模式：「Block」（块级）和「Inline」（行内）。默认新建页面是 Block，但如果你复制了别人代码或导入模板，可能混入 Inline 元素，导致图片和文字挤在同一行、换行异常。
更隐蔽的问题是：图片还没加载完，CSS 已经计算好位置，加载完成瞬间又重排，造成“闪动”或“偏移”。这不是对齐问题，是渲染时序问题。
- 进 SeedProd 页面编辑器右上角，点齿轮图标 → Layout Mode → 确保是
Block - 避免在图片前/后紧挨着放空格、换行符或
- 如需等图片加载完再显示，SeedProd 不支持原生 lazyload 控制，可临时加简单 JS：
document.querySelectorAll('img').forEach(i => i.addEventListener('load', () => i.style.opacity = '1'));，配合初始opacity: 0防抖动
