卡片
使用一组卡片更动态地展示信息 — 可带或不带图片
您可以使用卡片创建视觉上悦目的页面布局，在网格中组合文字和图像。它们非常适合构建登录页面或以非线性方式展示其他内容。
您可以调整 在中等或大型卡片之间切换 并将它们链接到相关资源。
卡片示例
添加链接
将鼠标悬停在卡片上并打开其 选项菜单 
。在这里您可以添加目标链接，这样用户点击卡片时可以直接跳转到某个位置。
在创建卡片时，我们建议您使用 目标链接而不是超链接。使用目标链接，读者可以点击卡片上的任意位置来访问链接的 URL。
添加图像
将鼠标悬停在卡片上并打开其 选项菜单 。在这里您可以为卡片添加封面图像。或者，直接点击卡片本身的 添加封面图像 选项。
这将打开 选择文件 模态窗口。在这里您可以将新的图像拖放到此处，或使用您之前上传到空间的图像文件。
为深色模式添加图像
您还可以添加只在深色模式下显示的封面图像。
为此，请打开卡片的 选项菜单 并选择 封面 > 编辑封面 > 为深色模式添加封面。这将打开 选择文件 模态窗口，您可以在其中拖放新图像或选择先前上传的图像。
选择合适的图像尺寸
GitBook 会在桌面和移动端自动将横向图像裁剪为 16:9 比例。如果您上传的图像是纵向或 1:1 比例，它们将在桌面上被裁剪为 16:9，并在移动端显示为方形或纵向。
为了在桌面和移动端保持一致，我们建议将所有卡片图像以 16:9 格式上传（例如 1920px x 1080px）。
如果您希望卡片根据屏幕尺寸自适应布局，我们建议上传 1:1 比例的图像，并将图像内容居中。
更改卡片大小
您可以通过打开位于卡片区块左侧的 选项菜单 来选择卡片大小。该 中等 选项在一行中创建三个卡片，而 大型 选项在每行显示两个更大的卡片。
您可以使卡片区块 占满窗口的全部宽度 方法是点击区块旁边的 选项菜单 
并选择 全宽.
在 Markdown 中的表示
<table data-view="cards">
<thead>
<tr>
<th></th>
<th></th>
<th data-hidden data-card-target data-type="content-ref"></th>
<th data-hidden data-card-cover data-type="files"></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>示例标题 1</strong></td>
<td>示例描述 1。</td>
<td><a href="https://example.com">https://example.com</a></td>
<td><a href="https://example.com/image1.svg">example_image1.svg</a></td>
</tr>
<tr>
<td><strong>示例标题 2</strong></td>
<td>示例描述 2。</td>
<td><a href="https://example.com">https://example.com</a></td>
<td><a href="https://example.com/image2.svg">example_image2.svg</a></td>
</tr>
<tr>
<td><strong>示例标题 3</strong></td>
<td>示例描述 3。</td>
<td><a href="https://example.com">https://example.com</a></td>
<td><a href="https://example.com/image3.svg">example_image3.svg</a></td>
</tr>
</tbody>
</table>最后更新于
这有帮助吗？