Spacious主题图片默认左对齐，需在“额外CSS”中添加.entry-content img.aligncenter{display:block;margin:0 auto;}实现居中，右对齐用.entry-content img.alignright{float:right;margin-left:1em;}，响应式下需加媒体查询覆盖。
图片在Spacious主题里默认左对齐，怎么改成居中或右对齐
Spacious主题的图片默认靠左，是因为它给 alignleft 类（通过 WordPress 的编辑器自动添加），而主题 CSS 又没给 aligncenter 或 alignright 提供足够强的样式覆盖。
实操建议：
- 在编辑器里选中图片 → 点「对齐方式」按钮 → 选「居中」，WordPress 会自动加
aligncenter类，但 Spacious 默认不响应这个类，需要手动补 CSS - 进「外观 → 自定义 → 额外 CSS」，粘贴这段（适配居中）：
.entry-content img.aligncenter { display: block; margin-left: auto; margin-right: auto; } - 右对齐同理，补：
.entry-content img.alignright { float: right; margin-left: 1em; }（注意：float会影响后续段落流式布局，慎用）
用 style 属性强行对齐为什么有时失效
直接在图片 HTML 里写 style="text-align: center;" 没用 —— text-align 对行内元素（如 margin。
常见错误现象：
-
-
display: block
正确写法（仅限单图临时调整）：
@@##@@
主题更新后自定义 CSS 被清空怎么办
Spacious 主题升级时不会保留「额外 CSS」里的内容，这是 WordPress 自定义功能的通病，不是主题 bug。
解决思路：
- 把关键 CSS 存在本地文本文件里，每次更新前备份、更新后重贴
- 更稳妥的做法：新建一个子主题，把 CSS 写进子主题的
style.css里（路径通常是/wp-content/themes/spacious-child/style.css），这样完全不受父主题更新影响 - 别用插件“一键保存 CSS”——多数这类插件只是把 CSS 存进数据库，照样会在主题切换或某些缓存清理时丢失
响应式下图片对齐错乱，比如手机端居中失效
Spacious 的移动端断点（@media screen and (max-width: 768px)）里，部分 CSS 会重置 float 或强制 width: 100%，导致你写的 margin: 0 auto 失效。
检查方法：用浏览器开发者工具（F12）切到手机视图，看图片元素是否还带着 aligncenter 类，再看计算后的 margin-left 和 margin-right 是不是被覆盖成了 0。
修复建议：
- 在额外 CSS 里追加媒体查询：
@media screen and (max-width: 768px) { .entry-content img.aligncenter { margin-left: auto !important; margin-right: auto !important; } } - 避免用
float做对齐，尤其在响应式场景；优先用display: block + margin或现代方案如text-align: center包一层真正麻烦的是嵌套在短代码或 Gutenberg 图片区块里的图片——它们生成的 HTML 结构更复杂，class 名可能带哈希，这时候光靠 CSS 类名定位就不够稳，得结合属性选择器或直接改区块设置。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
