





原型确认后,进入前端开发阶段。这个阶段的目标是把原型变成可运行的页面。
HTML结构生成
告诉AI:“根据产品页原型,生成HTML代码。”AI会输出包含导航、产品参数表、应用场景、FAQ区块和询盘表单的完整HTML文件。保存为“product.html”,用浏览器打开即可预览。

CSS样式生成
HTML结构有了,但样式还没加。告诉AI:“给产品页添加样式,主色用深蓝,参数表用斑马纹,按钮用圆角。”AI会生成对应的CSS代码。如果某个模块的间距不对,直接说:“参数表和FAQ区块之间的间距加大。”AI会更新CSS。
JavaScript交互生成
如果需要表单提交、导航切换、图片轮播等交互功能,用对话描述需求。告诉AI:“表单提交后显示成功提示,并清空输入框。”AI会生成对应的JavaScript代码。在浏览器中测试表单提交,确认提示正常显示。