safety-eval-service-frontend/.cursor/skills/specs/01-技术栈与基础/04-图片布局约束/SKILL.md

1002 B
Raw Blame History

name description
jjb-image-layout-constraint 定义基于图片生成代码时的布局约束规范。在根据用户上传的图片生成代码、还原页面布局或分析设计稿时使用。要求严格分析并执行图片中的布局结构,不得自行调整或优化。

技术栈与基础

图片布局约束

  • 图片生成代码规范:当用户上传图片并根据图片生成代码时,必须 严格执行图片中的布局结构。

  • 布局分析要求

    • 仔细分析:必须仔细分析图片中的布局结构,包括但不限于:

      • 组件的位置关系(上下、左右、嵌套等)

      • 组件的尺寸比例和间距

      • 组件的对齐方式

      • 组件的排列顺序

      • 组件的视觉层次

    • 严格执行:生成的代码必须严格按照图片中的布局结构实现,不得自行调整或优化布局。

    • 布局还原:确保生成的页面布局与图片中的布局结构完全一致。