Hestia主题图片对齐需用Gutenberg图像块对齐控制或自定义CSS类，禁用HTML align属性和内联样式；Banner对齐靠后台Header Image设置；Elementor需屏蔽Hestia冲突CSS。
HTML图片对齐代码在Hestia主题里直接写没用
因为Hestia（尤其是最新版）默认禁用文章编辑器里的自定义HTML，alignleft、alignright这类class会被自动过滤，甚至<img>标签的style属性也可能被清空。不是你代码写错了，是主题主动“拦”了。
- 检查是否启用了Classic Editor插件——如果用的是Gutenberg（块编辑器），
<img align="right">这种老写法完全不生效 - Hestia依赖WordPress的
wp_kses_post()过滤机制，原生align属性、float内联样式都会被剥离 - 即使临时禁用过滤，更新主题后大概率回退，不推荐改核心函数
Hestia首页图片对齐必须走CSS类 + 块编辑器支持
正确路径是用Gutenberg的「图像块」自带对齐控制，再配合Hestia预留的CSS钩子。它不认aligncenter，但认wp-block-image下的is-style-rounded这类扩展类，对齐靠的是is-aligned-left、is-aligned-right等动态生成的class。
- 在图像块右上角点击「更多选项」→「对齐方式」选左/右/居中，Gutenberg会自动加对应class，Hestia有配套CSS规则
- 如果要手动加浮动效果（比如文字绕排），得在图像块「高级」→「额外CSS类」里填
float-left或float-right，然后在「外观 → 自定义 → 额外CSS」里补上：img.float-left { float: left; margin-right: 1rem; } - 避免用
!important——Hestia的CSS权重已经很高，硬加容易破坏响应式断点
首页大图Banner对齐失效？查header_image设置和cover容器
Hestia首页顶部Banner不是普通<img>，而是通过header_image主题选项加载，最终渲染进<div class="cover">。这里的对齐逻辑由background-position控制，不是HTML属性能改的。
- 后台「外观 → 自定义 → Hestia Options → Header Image」里上传图片后，对齐靠的是「Header image position」下拉菜单（如
center center、top right） - 如果想用CSS微调，目标选择器是
.cover .cover-background，不是img标签——它实际是background-image - 移动端常出现对齐错位，是因为Hestia对
.cover设置了background-attachment: fixed，某些安卓浏览器不兼容，建议在额外CSS里覆盖：@media (max-width: 768px) { .cover .cover-background { background-attachment: scroll; } }
用Elementor拖拽时图片对齐乱套？关掉Hestia的CSS冲突项
Elementor和Hestia都重写了.wp-block-image样式，且Hestia的style.css里有一段针对.elementor-widget-image img的强制居中规则，会覆盖Elementor自己的对齐设置。
立即学习“前端免费学习笔记（深入）”；
- 临时解决：在Elementor编辑器里选中图片模块 → 「样式」→ 「对齐」设为左/右后，在「高级」→ 「自定义CSS」里加：
selector img { display: inline-block !important; float: left !important; } - 长期建议：在「外观 → 自定义 → 额外CSS」里屏蔽Hestia的干扰规则：
.elementor-widget-image img { float: none !important; margin: 0 auto !important; } - 注意：Elementor Pro的「Theme Style」开关如果开着，会自动注入Hestia字体/间距规则，可能间接影响图片容器宽度，导致对齐偏移
