页面出血

页面出血用于突破正文区域的留白，让题图、横幅或装饰背景贴近阅读页边缘。正文仍然保留原来的排版范围。

适合用在

把出血声明写在承载图片的容器上：

.chapter-banner {
  margin: 0;
  reeden-bleed: lefttopright;
}

.chapter-banner img {
  display: block;
  width: 100%;
  height: auto;
}

<div class="chapter-banner">
  <img src="../Images/chapter-banner.jpg" alt="章节题图" />
</div>

lefttopright 表示向左、顶部和右侧延伸。容器中的图片会沿用这个效果。

顶部出血最适合放在章节开头。双页阅读时，左右出血分别以当前物理页为边界，不会越过书页中缝。

left · 向左侧

top · 向顶部

right · 向右侧

lefttop · 向左侧和顶部

topright · 向顶部和右侧

leftright · 向左右两侧

lefttopright · 向左、上、右

组合值必须连续小写，例如 lefttopright；不要写成 left top right 或 left-top-right。当前没有向底部出血的取值。

只需要一张图片贴边时，也可以把 reeden-bleed 直接写在图片自己的选择器上。

检查题图容器及其父元素是否还有 margin 或 padding。声明应写在实际承载图片或背景的元素上。

Reeden 会尊重图片明确设置的局部宽度。需要通栏效果时，通常还要给图片设置 width: 100%。

top 表示图片位于页面顶部时可以消除顶部留白，不会把章节中部的图片强行移动到页首。需要顶部题图时，应把它放在章节内容开头。

这是预期行为。每个物理页独立处理出血，图片不会跨越装订中缝覆盖另一页。

duokan-bleed 是 reeden-bleed 的兼容写法。