chatgpt創作 一秒生成寵物網站

首先問他:

我要你製作一個2002年代的風格的網站,主題給你自由發揮,把html,css,js代碼寫在同一個html檔即可

之後chatgpt八成會給出一個寫到一半不完整的代碼

不過沒關係

把那段代碼複製起來

然後再跟他說:

我要你製作一個2002年代的風格的網站,主題給你自由發揮,把html,css,js代碼寫在同一個html檔即可 以下是我寫到一半的代碼你從斷掉的地方接下去寫就好,已經有寫的代碼不需要重複寫 !DOCTYPE html html head title2002年代風格的虛擬寵物社區/title style body { background-color: #FFCCCC; font-family: Arial, sans-serif; margin: 0; padding: 0; } .header { background-color: #FF6666; color: #FFFFFF; padding: 10px; text-align: center; } .nav { background-color: #FF9999; color: #FFFFFF; display: flex; justify-content: center; padding: 10px; } .nav a { color: #FFFFFF; margin: 0 10px; text-decoration: none; } .nav a:hover { color: #FFCCCC; } .main { display: flex; flex-wrap: wrap; justify-content: center; padding: 10px; } .box { background-color: #FFFFFF; border: 2px solid #FF6666; border-radius: 10px; box-shadow: 5px 5px 5px #999999; margin: 10px; padding: 20px; width: 300px; } .box h2 { color: #FF6666; font-size: 24px; margin-top: 0; text-align: center; } .box p { text-align: justify; } .footer { background-color: #FF6666; color: #FFFFFF; padding: 10px; text-align: center; } /style /head body div class="header" h12002年代風格的虛擬寵物社區/h1 /div div class="nav" a href="#"首頁/a a href="#"寵物商店/a a href="#"我的寵物/a a href="#"社區論壇/a a href="#"聯絡我們/a /div div class="main" div class="box" h2新手上路/h2 p歡迎加入虛擬寵物社區！這裡是一個專門為寵物愛好者設計的社區，你可以在這裡養寵物、與其他寵物愛好者交流，還可以參加各種有趣的活動。如果你是新手，請點擊進入「新手上路」專區，了解如何開始你的虛擬寵物之旅。/p /div div class="box" h2最新活動/h2 p本月的最新活動是「寵物大

只要跟他強調一點:

以下是我寫到一半的代碼你從斷掉的地方接下去寫就好,已經有寫的代碼不需要重複寫

他就會接下去把代碼完成了

然後注意一下裡面有個部分

<div> 		

<a href="#">首頁</a> 		

<a href="#">寵物商店</a> 		

<a href="#">我的寵物</a> 		

<a href="#">社區論壇</a> 		

<a href="#">聯絡我們</a>

貼已經半完成的代碼

其中a href="#"寵物商店/a這部份我希望你繼續實作出一個html檔案

檔案名稱你自己取,css可以寫在同一份檔案,風格粉色系,注意排版美觀,置中,放一些寵物的照片,其餘自行發揮.

他就會幫忙完成了

我用這個方法嘗試把寵物商店和我的寵物頁面完成

github url:

https://github.com/skywalker0803r/chatgpt-create-pet-store