挑战一个有难度的,0基础用AI搭建一个GPTs导航站

方式:发截图给ChatGPT让他帮我生成HTML代码

目标:本次只生成静态html,至于后续动态的样式,可能要后面再做。

下面是步骤:

1、根据网页截图生成HTML代码

image

 

图片[2]-挑战一个有难度的,0基础用AI搭建一个GPTs导航站 - 尔鹿网络-尔鹿网络

2、让他把背景色设置为#54b5a6,字体颜色设置为白色

image

图片[4]-挑战一个有难度的,0基础用AI搭建一个GPTs导航站 - 尔鹿网络-尔鹿网络

 

这时候有点样子了,然后让他这里的Home About Contact移动到top gpts右边

image

 

图片[6]-挑战一个有难度的,0基础用AI搭建一个GPTs导航站 - 尔鹿网络-尔鹿网络

图片[7]-挑战一个有难度的,0基础用AI搭建一个GPTs导航站 - 尔鹿网络-尔鹿网络

这个时候顶格完成了。

image

 

3、把代码贴上去,然后说请在我发送的代码中添加图片中的组件

image

 

图片[10]-挑战一个有难度的,0基础用AI搭建一个GPTs导航站 - 尔鹿网络-尔鹿网络

4、这个效果还行

image

 

图片[12]-挑战一个有难度的,0基础用AI搭建一个GPTs导航站 - 尔鹿网络-尔鹿网络

5、再添加一个,

image

 

图片[14]-挑战一个有难度的,0基础用AI搭建一个GPTs导航站 - 尔鹿网络-尔鹿网络

6、最终的成果还是不错的

image

 

图片[16]-挑战一个有难度的,0基础用AI搭建一个GPTs导航站 - 尔鹿网络-尔鹿网络

© 版权声明
THE END
喜欢就支持一下吧
点赞7 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容