全出血布局 · Full-bleed Layout
英文：Full-bleed Layout
页面布局难度：入门 ★
🗣️一句话大白话
图片、视频或颜色区域延伸到屏幕边缘，制造沉浸式首屏或章节过渡。图片、视频或颜色区域一直延伸到屏幕边缘，不受普通内容容器限制。它常被用来制造沉浸式首屏或章节过渡。
🖼️样图参考
🎬真实场景
品牌首页、作品开场、摄影网站、产品发布页、沉浸式故事
📮你可以这样说
「为 Punk 的首页创建一个 Full-bleed Hero， 背景视觉铺满浏览器宽度并占据 90vh，不受主内容 max-width 限制， 前景放置大标题、简短介绍和 View Work 按钮； Hero 下方的正文重新回到 1120px 的居中容器，并保证文字与背景有足够对比度。 【图像模型版】竖版 3:4 海报，主题为[主题]。采用满版主视觉构图：单张[图像描述]铺满整个画布（full bleed，无白边），标题「[主标题]」叠加在图像的天空或暗部等低细节区域，高对比；次要信息收纳到底部安全条。避免文字压在复杂纹理上、避免主体关键部位被裁切。Keywords: full-bleed image, hero image, type overlay, immersive poster.」
通过 AI绘图 工作台生成（模型 API 额度由此消耗）；未配置模型密钥时会提示失败原因。
⚠️边界与常见误解
- ▸误解：全出血就是整个页面铺满。实际只有 Hero 或章节过渡区延伸到边缘，正文通常回到受限容器
🚫什么时候别用
- ✗以文字阅读为主的密集内容页（全出血会浪费空间）
🧩常见变体
全屏 Hero章节间全宽色带
🕸️知识关系图
这个词条与相关术语、AI绘图 知识的连接关系
🔗相关术语
🛠️关联 AI 绘图知识
在「AI 绘图工作台」查看该术语的提示词与案例（需本地启动工作台，端口 5345）