For the complete documentation index, see llms.txt. This page is also available as Markdown.

卡片

使用一组卡片更动态地展示信息——可带图或无图

你可以使用卡片通过网格组合文本和图片,创建一个视觉上赏心悦目的页面布局。它们非常适合构建着陆页,或以非线性的方式展示其他任何内容。

你可以调整 在中号卡片和大号卡片之间切换 并将它们链接到相关资源。

卡片示例

将鼠标悬停在卡片上并打开其 选项菜单 The Options menu icon in GitBook。在这里你可以添加目标链接,这样读者在点击卡片时就能直接跳转到某个位置。

添加图片

将鼠标悬停在卡片上并打开其 选项菜单 The Options menu icon in GitBook。在这里你可以为卡片添加封面图片。或者,直接点击卡片上的 添加封面图片 选项。

这将打开 选择文件 模态窗口。在这里你可以将新图片拖放到其中,或者使用你之前上传到该分区的图片文件。

为深色模式添加图片

你也可以添加仅在深色模式下显示的封面图片。

为此,请打开卡片的 选项菜单 并选择 封面 > 编辑封面 > 为深色模式添加封面。这将打开 选择文件 模态窗口,你可以在此拖放新图片或选择之前上传的图片。

选择合适的图片尺寸

GitBook 会自动将横向图片裁剪为桌面端和移动端均为 16:9 的比例。如果你上传的是纵向图片或 1:1 比例的图片,它们在桌面端会被裁剪为 16:9,在移动端则显示为正方形或纵向。

A GitBook screenshot showing card images on desktop
在桌面端,所有卡片图片都会以横向 16:9 比例显示,不管其尺寸如何。为保持一致性,我们建议使用相同尺寸。
A GitBook screenshot showing card images on mobile
在移动端,正方形或纵向图片的显示效果如左图所示。横向图片的显示效果如右图所示。

为了在桌面端和移动端保持一致,我们建议将卡片的所有图片都以上传为 16:9 格式(例如 1920px x 1080px)。

如果你希望卡片根据屏幕大小自适应布局,我们建议上传 1:1 比例的图片,并将图片内容居中。

更改卡片大小

你可以通过打开 选项菜单 The Options menu icon in GitBook 位于卡片块左侧的 中号 选项,可将三张卡片放在一条横向线上,而 大号 选项则会在每一行显示两张更大的卡片。

Markdown 中的表示方式

最后更新于

这有帮助吗?