29 lines
1002 B
Markdown
29 lines
1002 B
Markdown
|
---
|
|||
|
|
name: jjb-image-layout-constraint
|
|||
|
|
description: 定义基于图片生成代码时的布局约束规范。在根据用户上传的图片生成代码、还原页面布局或分析设计稿时使用。要求严格分析并执行图片中的布局结构，不得自行调整或优化。
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
# 技术栈与基础
|
|||
|
|
|
|||
|
|
## 图片布局约束
|
|||
|
|
|
|||
|
|
- **图片生成代码规范**：当用户上传图片并根据图片生成代码时，**必须** 严格执行图片中的布局结构。
|
|||
|
|
|
|||
|
|
- **布局分析要求**：
|
|||
|
|
|
|||
|
|
- **仔细分析**：必须仔细分析图片中的布局结构，包括但不限于：
|
|||
|
|
|
|||
|
|
- 组件的位置关系（上下、左右、嵌套等）
|
|||
|
|
|
|||
|
|
- 组件的尺寸比例和间距
|
|||
|
|
|
|||
|
|
- 组件的对齐方式
|
|||
|
|
|
|||
|
|
- 组件的排列顺序
|
|||
|
|
|
|||
|
|
- 组件的视觉层次
|
|||
|
|
|
|||
|
|
- **严格执行**：生成的代码必须严格按照图片中的布局结构实现，不得自行调整或优化布局。
|
|||
|
|
|
|||
|
|
- **布局还原**：确保生成的页面布局与图片中的布局结构完全一致。
|