Thimble 是一個由 Mozilla 開發的線上網頁編輯器，能編輯 HTML、CSS、JS，並且擁有即時預覽功能，讓你可以一邊寫一寫改！

 

 

第1步 開啟 Thimble，點選『 Start a project from scratch 』，即可進入編輯器

 

 

第2步 編輯器採三欄式，左邊是該專案下的所有檔案，中間是檔案的原始碼，右邊即為線上預覽

 

 

第3步 編輯原始碼的時候，右邊馬上就會反映出正在編輯的區域！

 

 

第4步 修改 CSS 也是沒問題的！

 

 

第5步 提示功能也沒少喔！

 

 

第6步 上方可以修改專案名稱

 

 

第7步 也可以新增HTML、CSS、JS 等的檔案

 

 

第8步 要儲存專案的話必須先註冊或登入

 

 

第9步 註冊畫面相當簡單，只需要輸入帳號、Email、密碼(需有一個大寫/小寫字母)

 

 

第10步 登入後即可儲存專案，也可以匯出為zip檔案

 

 

第11步 『 Your Projects 』頁面中可以查看你已儲存的所有專案

 

Thimble 整體設計非常精美！而且Mozilla有把它開源在 Github 上喔！有時間可以去看看^^