> ## Documentation Index
> Fetch the complete documentation index at: https://manus.im/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# 编辑与预览

> Manus 允许您通过即时反馈和自然语言编辑来构建和完善您的 Web 应用

### 编辑：轻松、对话式的更改

在 Manus 中编辑您的 Web 应用程序就像进行对话一样简单。无需编写代码或导航复杂的菜单。您可以通过自然语言描述您想要的内容来更改您的网站，无论是单个调整还是大规模更新。

#### 可视化编辑

Manus 1.5 引入了 3 种灵活的方式来编辑您的网站：

### **快速样式控制**

单击任何元素即可打开即时样式面板。无需等待，无需提示——只需直接控制：

* 颜色：更改背景、文本、边框
* 排版：调整字体、大小、粗细
* 间距：修改内边距、外边距、间隔
* 边框：更新样式、宽度、半径

非常适合快速设计迭代和微调。

### **基于提示词的批量编辑**

为了让您的工作流程更加高效，Manus 允许您执行**基于提示词的群组编辑**。您可以在单个提示词中描述多个更改，Manus 将智能地打包并将它们作为单个更新一起应用。这非常适合进行一系列相关的调整，而无需逐一发出命令。

例如，您可以给出如下一个单一、全面的指令：

> "好的，让我们做一些更改。首先，将主标题加粗，并将其颜色更改为我们品牌的深蓝色。接下来，调整定价表中的间距，使其更宽敞。最后，将整个页脚部分的背景颜色更改为浅灰色。"

Manus 将理解您的提示词中的不同请求，并一次性执行所有这些请求，从而节省您的时间和精力。

| 编辑类型   | 示例提示词                    |
| :----- | :----------------------- |
| **样式** | `"将所有标题的字体更改为 Georgia。"` |
| **布局** | `"增加此列表中项目之间的间距。"`       |
| **内容** | `"将主按钮的文本更改为 '立即开始'。"`   |
| **结构** | `"复制此部分并将其放在联系表单下方。"`    |

### AI 编辑：您的创意伙伴

对于更复杂或更有创意的更改，您可以使用 AI 编辑功能。只需选择一个元素，然后要求 Manus 改进它。这就像您拥有了一位触手可及的设计顾问和文案撰稿人。

| 目标       | 示例提示词                        |
| :------- | :--------------------------- |
| **改进文案** | `"重写此标题，使其更具吸引力并以利益为导向。"`    |
| **增强设计** | `"为本节建议一个更好、更现代的调色板。"`       |
| **优化布局** | `"重组此功能列表，使其更具视觉吸引力且更易于浏览。"` |

Manus 将为您提供建议并应用更改，让您可以轻松地将您的设计和内容提升到更高的质量水平。

Manus 提供了实时编辑和预览您的 Web 应用程序的无缝体验。这使得快速迭代成为可能，并确保您可以在进行更改时可视化这些更改。

## 预览：实时查看您的应用程序

Manus 在整个开发过程中提供您的 Web 应用程序的实时交互式预览。这使您能够随时查看所做的更改，并在真实环境中测试应用程序的功能。

### 桌面/移动端

预览窗口允许您在桌面和移动视图之间切换，确保您的应用程序具有响应性并在所有设备上看起来都很棒。您可以测试不同屏幕尺寸下的用户体验，并根据需要进行调整，以针对桌面和移动用户进行优化。

### 路径

预览窗口包含一个 URL 栏，显示您正在查看的页面的当前路径。这对于导航到应用程序中的特定页面以及了解您网站的 URL 结构非常有用。

### 全屏

为了获得更沉浸式的体验，您可以将预览扩展到全屏模式。这对于向利益相关者展示您的应用程序，或在没有周围界面干扰的情况下更好地了解您网站的整体外观和感觉特别有用。

#### 实时预览

从开发过程的一开始就可以获得应用程序的实时交互式预览。这使您可以立即看到请求的结果，并提供反馈以进行调整。实时预览是迭代开发过程的重要组成部分，使您能够使用自然语言命令完善您的应用程序并立即看到更改的反映。