Notion AI 不支持 HTML 图片对齐代码,所有 img 标签的 align、style、float 等属性均被自动剥离;唯一有效对齐方式是使用原生块操作(如图片块右上角选 Center 或放入 column 右列)。
notion ai 不支持 html 图片对齐代码,所有 <img> 的 align、style、float 等属性都会被自动剥离,强行写进去也没用。
Notion 里根本不能用 HTML 控制图片对齐
Notion 的编辑器不是浏览器渲染引擎,它只接受极简的 Markdown 和有限的富文本语义。你粘贴 <img src="..." align="right"> 或 <img style="float: left;">,保存后这些属性全消失——Notion 只保留 src 和可选的 alt,其余一概无视。
常见错误现象:
• 粘贴带 style 的 HTML 图片后,图片居左且无法拖动
• 在代码块里写完整 <img> 标签,显示为纯文本而非图片
• 以为用 div + style 包裹能生效,结果整个区块被当作文本渲染
- 使用场景:想在 Notion 页面中实现图文混排(比如文字绕图、侧边图注)
- 根本原因:Notion 的渲染层在前端就做过滤,只允许白名单属性,
align和style不在其中 - 性能/兼容性影响:不是慢或兼容差的问题,是“根本不走那条路”——没解析、没应用、没 fallback
Notion AI 能帮你“改写布局”,但不是生成 HTML
Notion AI 的「重写」或「调整格式」功能,本质是基于语义理解做 Markdown 或块结构重组,不是编译或注入 HTML。它可能把一段文字+图片描述,转成「文字段落 + 内联图片块 + 引用块」这样的组合,但它不会也不允许输出带 style 的标签。
- 它可能建议你:把图片单独放在段落上方/下方,再用
/callout或/quote块补充说明 - 它不会建议你加
text-align: center,因为 Notion 没这个 CSS 上下文 - 如果你输入“请用 HTML 让图片右对齐”,AI 可能真给你写一段代码,但那代码在 Notion 里完全无效——别信
真正能控制图片位置的唯一方式:用 Notion 原生块逻辑
Notion 的图片块本身不支持对齐,但你可以靠块顺序、容器块和宽度控制来逼近效果:
立即学习“前端免费学习笔记(深入)”;
- 图片需要“靠右”?把它放在一个
/column块的右列,左列放文字 - 需要“小图+文字环绕”?放弃,Notion 没浮动;改用
/image块设为“Inline”,然后紧跟文字段落(注意:Inline 图片尺寸固定,不可调) - 想居中?选中图片块 → 点右上角
⋯→ 选Center(这是唯一生效的对齐操作) - 重要限制:所有列(
/column)、画布(/canvas)、表格都不支持嵌套图片对齐样式,它们只管容器级布局
最容易被忽略的一点:Notion 移动端会强制重排所有多列/画布结构,所谓“右对齐图片”在手机上大概率变成上下堆叠——别为响应式操心,它本来就不支持。











