預覽

在瀏覽器本地工作區中預覽 HTML、CSS 和 JavaScript，然後將其渲染到與父級 ComUtil 頁面隔離的沙箱 iframe 中。

什麼是 HTML 預覽？

HTML 預覽為你提供一個瀏覽器優先的工作區，用來一起測試原始 HTML、CSS 和 JavaScript。當你想快速製作 UI 原型、驗證佈局行為或排查標記問題，而又不想切換到更重的本地專案環境時，它會很有用。

工作原理

編輯器會將草稿儲存在瀏覽器本地，然後透過寫入具有隔離 origin 的沙箱 iframe 來重新整理預覽。指令碼可以在該預覽中執行，但沙箱會將它們與父級 ComUtil 頁面隔離，而專用標籤頁路徑也會保持同樣的邊界。

常見使用場景
  • 學習和練習 HTML/CSS
  • 原型設計 UI 元件
  • 測試響應式設計
  • 除錯 CSS 佈局問題
  • 在分享前檢查隔離的 HTML 片段
功能
  • 輸入時進行沙箱預覽
  • 全面的 HTML/CSS/JavaScript 支援
  • 瀏覽器本地草稿儲存
  • 用於更大預覽的專用沙箱標籤頁
常見問題

我可以使用外部 CSS 框架嗎？

是的，您可以包含 Bootstrap、Tailwind 或任何其他框架的 CDN 連結。在 HTML 的 head 部分新增 link 標籤。

我的程式碼會被儲存嗎？

程式碼儲存在瀏覽器的本地儲存中。它在同一裝置的不同會話之間持久存在，但不會跨裝置同步。