mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
locadex-agent[bot]
74 lines
2.4 KiB
Plaintext
74 lines
2.4 KiB
Plaintext
---
|
||
title: "添加媒体"
|
||
description: "在文档中上传并使用图片及其他资源。"
|
||
keywords: ["editor", "media", "images", "assets"]
|
||
---
|
||
|
||
<div id="supported-file-types">
|
||
## 支持的文件类型
|
||
</div>
|
||
|
||
- **图片**：PNG、JPG、JPEG、SVG、GIF、WebP
|
||
- **视频**：MP4、WebM
|
||
- **字体**：TTF、WOFF、WOFF2
|
||
- **其他**：PDF、ICO（网站图标）
|
||
|
||
<div id="add-media-to-a-page">
|
||
## 在页面中添加媒体
|
||
</div>
|
||
|
||
<div id="drag-and-drop">
|
||
### 拖放
|
||
</div>
|
||
|
||
在可视化模式下，将媒体从你的电脑或资源管理器拖放到页面上。这些文件会保存到 `images/` 文件夹的根目录下。
|
||
|
||
<div id="slash-command">
|
||
### 斜杠命令
|
||
</div>
|
||
|
||
输入 <kbd>/image</kbd> 以打开图片菜单，然后上传新图片或选择已有图片。
|
||
|
||
<div id="upload-files">
|
||
### 上传文件
|
||
</div>
|
||
|
||
使用侧边栏中的资源管理器上传或搜索文件。
|
||
|
||
<Frame>
|
||
<img src="/images/editor/assets-light.png" alt="在编辑器侧边栏菜单中选中的资源管理器。" className="block dark:hidden" />
|
||
<img src="/images/editor/assets-dark.png" alt="在编辑器侧边栏菜单中选中的资源管理器。" className="hidden dark:block" />
|
||
</Frame>
|
||
|
||
在资源管理器中点击 **Upload** 按钮，从电脑上传文件。
|
||
|
||
<div id="manage-assets">
|
||
## 管理资源
|
||
</div>
|
||
|
||
<div id="organize-with-folders">
|
||
### 使用文件夹整理
|
||
</div>
|
||
|
||
在文件资源管理器中点击 **+** 按钮创建新文件夹。在文件树中拖拽文件和文件夹以重新调整它们的结构。
|
||
|
||
<div id="rename-and-edit-assets">
|
||
### 重命名和编辑资源
|
||
</div>
|
||
|
||
将鼠标悬停在资源上，点击 **...** 按钮，以重命名文件或更新其 alt 文本。
|
||
|
||
<div id="delete-assets">
|
||
### 删除资源
|
||
</div>
|
||
|
||
将鼠标悬停在某个资源上，然后点击 <Icon icon="trash" /> 删除按钮。
|
||
|
||
<div id="best-practices">
|
||
## 最佳实践
|
||
</div>
|
||
|
||
- **使用描述性名称**：为文件使用清晰、具有描述性的名称。例如，将文件命名为 `api-dashboard-light.png`，而不是 `img1.png`。
|
||
- **添加替代文本（alt text）**：为图像提供描述性的替代文本，以提升可访问性和 SEO（搜索引擎优化）。
|
||
- **通过文件夹进行组织**：将相关资源分组管理，例如浅色和深色模式的不同版本，或某个特定功能区域使用的资源。
|
||
- **使用合适的格式**：PNG 适用于带透明度的图形，JPG 适用于照片，SVG 适用于图标和徽标。 |