← All templates

整页图片 <FullBleed />

一张真实截图或照片铺满整页,底部渐暗,左下角白字标题和说明。SlideDef 上要设 tone: "dark"。

Template and style descriptions are currently available in Chinese only.

Group
节奏 · 一张图占满整页
Component
FullBleed · #full-bleed

Good for

  • 一张图就能说明问题
  • 章节之间的视觉停顿

Avoid when

  • 图片不是真实截图或照片
  • 需要标注图上的细节:用 Screenshot

Content limits

1src 是真实截图或照片,16:9 或更宽
2title ≤ 2 行 × 12 字
3caption ≤ 36 字
4source 写图片出处
5必须设 tone: "dark"

Fields

FieldType
src · requiredstring图片
alt · requiredstring图片说明
kicker · requiredstring小节名
title · requiredstring | string[]标题
captionstring说明
focusstring裁切焦点,CSS object-position
source · requiredstring出处

Example

{ id: 'bleed', tone: 'dark', label: '总览', render: () => (
  <FullBleed src={overview} alt="…" kicker="按 G" title={['一眼看完', '整份演示']} source="本项目截图" />
) }