HTML Editor: Code & Preview

使用 HTML 編輯器，將您的網頁創意轉換為可運行的頁面。編寫包含嵌入式 CSS 和 JavaScript 的 HTML 程式碼，預覽結果，並透過簡短的教學了解您正在修改的程式碼。對於在行動裝置上嘗試建立小型網頁的學生、初學者和開發人員來說，這是一個實用的工作空間。

編寫和檢查您的程式碼

使用具有語法高亮、括號匹配、自動閉合以及撤銷和重做功能的程式碼編輯器。當程式碼片段變長時，您可以顯示行號、尋找文字或跳到特定行。額外的符號工具列使常用編碼字元觸手可及，從而減少輸入標籤和表達式時鍵盤佈局的切換。

在「代碼」、「輸出」和「控制台」標籤之間切換。 「輸出」視圖會在應用程式內渲染您的文檔，包括其樣式和腳本。編輯時啟用自動預覽刷新，或者如果您希望控制結果更新時間，則可以將其關閉。 「控制台」訊息可協助您檢查頁面 JavaScript 的運作情況。

探索不同的預覽寬度

選擇手機、平板電腦或桌面預覽模式，探索佈局在不同寬度下的效果。這些視圖位於應用程式內，方便您在進行響應式設計時檢查間距和佈局。嘗試新增標題，調整樣式規則，然後返回輸出查看效果。

先學習概念，再實踐

學習模式整合了 HTML、CSS 和 JavaScript 的相關主題。您可以按主題篩選或搜尋特定概念，而無需按順序閱讀所有內容。每節課都包含講解、快速提示、實際應用、常見陷阱、範例和程式碼演練。

每節課都包含兩個簡短的編碼任務。首先複現範例，然後使用所學概念編寫新的程式碼片段。檢查您的答案，閱讀回饋，並在需要再次嘗試時重置初始任務。第二個任務會在第一個任務完成後解鎖。閱讀和練習進度會記錄在本地，方便您返回已開始學習的主題。

保存並分享您的作品

您可以建立文件、開啟已儲存的 HTML 文件，或使用「儲存」和「另存為」功能將您的作品儲存為 HTML 文件。如果您想傳送文件本身，請分享文件。對於線上交接，請產生傳輸程式碼或分享鏈接，並使用配套的 Web 編輯器繼續處理程式碼片段。線上傳輸會將目前代碼傳送到服務，因此需要網路連線。

打造舒適的工作空間

您可以選擇淺色、深色或系統預設外觀，並調整編輯器字體大小。透過設置，您可以控制行號、輔助功能模式、自動儲存、退出時備份和會話恢復。草稿和工作區副本是本機應用程式資料；請將重要工作儲存為文件，而不是將本機會話視為永久備份。

「資料與隱私」頁面可讓您查看設定、清除臨時編輯器資料或重設本機應用程式資料。 「獎勵中心」還提供可選的每日獎勵和基於廣告的金幣活動。獎勵金幣是應用程式內物品，而非現金。

編輯獨立頁面和閱讀捆綁課程無需線上服務。遠端圖像、外部腳本、線上傳輸和廣告則需要網路連線。使用 HTML 編輯器閱讀概念、嘗試變更、檢查結果，並保留您想要基於此進行建置的程式碼。