模块 3 · 界面设计与迭代 · 第 2/5 节
可视化编辑
需以当前账户界面为准：当前文档：行内改字每账号跨项目合计 100 次免费额度，每次使用后 24 小时恢复；工作区共享上限每 24 小时 2,000 次。超过上限按构建用量计费。选中元素或标注发送 AI 请求会计费；评论免费，实现评论会计费。实际余量需以当前账户界面为准。
🎯学习目标
- 会行内编辑文字并定位样式修改
- 知道可视化编辑适合什么场景
- 会与对话修改配合使用
🧭操作步骤
- 1
开启编辑
当前官方说明使用预览工具栏（Preview toolbar），旧 Visual Edits 体验已更新；选择元素或行内文字编辑，实际入口需以当前账户界面为准。
- 2
点击元素
使用 Select elements 选中一个或多个元素，把选择作为修改请求的上下文；不要假设一定出现通用样式面板。
- 3
直接调整
Edit text inline 可直接改文字；颜色、间距或布局通常通过选中元素后明确发送修改请求。也可绘制标注或添加评论。
- 4
保存修改
行内文字编辑后点击 Send 应用；检查预览与其他尺寸。添加评论本身不执行修改，发送评论让 Lovable 实现才会触发制作。
💬可复制提示词
复杂布局交给对话
把这个区块从上下排列改成左图右文，在手机上恢复为上下排列。
✅ 预期结果
- 区分行内改字与需要 AI 实现的样式请求
- 修改立即在预览中生效
- 知道何时改用对话
⚠️ 常见错误
- 用可视化编辑做复杂布局重构
- 只在电脑视图下调整间距，手机上错位
- 忘记保存修改
📝自检题
1. 以下哪项最适合用可视化编辑？
学完了？标记为已完成，记录你的进度。