郵件 CSS 內聯工具

在您的瀏覽器中本機執行

以正確的層疊將 CSS 內聯到郵件 HTML,保留媒體查詢並安全預覽

HTML 輸入

附加 CSS

選填的純 CSS,例如貼到這裡的外連樣式表。

上限:1,000,000 個字元(HTML + CSS)。

選項

輸出
格式
進階

層疊

樣式區塊

HTML 屬性

輸出

貼上郵件 HTML、上傳 .html 檔案或載入範例。

郵件 CSS 內聯工具

將 <style> 區塊與選填「附加 CSS」中的樣式移入 style 屬性,這是 Gmail、Outlook 等郵件用戶端能穩定呈現的格式。層疊依實際的權重、來源順序與 !important 規則計算,媒體查詢、@font-face 與 :hover 規則因無法內聯而保留在 <style> 區塊中。

使用方式
  1. 1.貼上完整的郵件文件或片段、上傳 .html 檔案,或載入範例。
  2. 2.如有需要,將額外 CSS(例如外連樣式表)貼到「附加 CSS」。
  3. 3.選擇輸出形式與格式;開啟「進階」可變更保留內容或加入的 HTML 屬性。
  4. 4.檢視警告,再於 HTML 分頁或郵件預覽中以桌面與行動裝置寬度檢查。
  5. 5.複製 HTML 或下載 email-inlined.html。
限制與隱私

所有處理都以 juice 函式庫在瀏覽器中完成;不會上傳任何內容,也絕不會取得外連樣式表或 @import 檔案。預覽在沒有指令碼的沙箱框架中執行,只有在你允許時才載入遠端圖片。瀏覽器中的顯示效果無法保證 Gmail 或 Outlook 中的效果。HTML 與選項儲存在此瀏覽器中;清除網站資料即可刪除。

CodingTool 已正式上線於

Launched on StartupBaseCodingTool.dev - Free, Fast & Easy Developer Tools in One Place | Product HuntCodingTool - Featured on Startup FameFazier badgeListed on Turbo0Featured on Twelve ToolsFeatured on Findly.tools