通过ScreenCoder的模块化多智能体框架可达成精确转换:
- 视觉识别模块:采用视觉-语言模型(VLM)解析PNG/JPG截图,检测元素边界精度达0.5px
- 布局规划模块:自动生成符合BEM规范的HTML结构,保留原始设计间距和定位
- 代码生成模块:输出带详细注释的响应式CSS代码,支持媒体查询
关键操作:
- 确保输入图像分辨率≥1080P
- 在html_generator.py中设置
pixel_perfect=True
Parameter - 使用Chrome开发者工具进行最后5%的微调
Diese Antwort stammt aus dem ArtikelScreenCoder: Ein Tool zur Umwandlung von UI-Screenshots in editierbaren HTML/CSS-CodeDie