HTML 美化

將緊湊或混亂的 HTML 格式化為可讀的縮排標記。

輸入
輸出
0 字元 0 行

讓 HTML 更易於檢查和編輯

HTML 美化 將緊湊的 HTML 擴展為可讀結構,在嵌套元素周圍有換行和縮排。 它對於檢查片段、範本、產生的標記、電子郵件和複製的頁面片段非常有用。

HTML 解析器可以從許多格式錯誤的文件中恢復,因此美化的輸出看起來比原始檔更乾淨,同時仍反映瀏覽器解析規則。格式設定應保留標籤和屬性,但應審查空白敏感的內聯文字。

使用方法

  1. 將 HTML 程式碼貼到輸入編輯器中。
  2. 點選 美化 HTML 以回流並縮排標記。
  3. 檢查輸出中是否有預期的巢狀、註解、內嵌文字和屬性。
  4. 使用 複製 作為剪貼簿,使用 下載 作為文件,或使用 清除 進行重置。

什麼是HTML美容儀?

HTML 美化 是一個基於瀏覽器的實用程序,用於將密集標記轉換為可以掃描和編輯的文件。它有助於揭示父子關係、錯位的結束標籤以及生成的大塊 HTML。

HTML 空格可能會影響內嵌佈局、文字節點和預先格式化內容。美化模板或生產標記後,驗證渲染的輸出是否仍符合您的意圖。

輸入說明

貼上 HTML 片段或完整文件。請小心建構系統可能依賴的 <pre>、內聯元素、模板語法和註解。

範例

一旦每個嵌套元素都放在自己的行上,密集的文件就會變得更容易理解:

--- 壓縮輸入 ---
<html><head><title>Test</title></head><body><p>Hello</p></body></html>

--- 美化輸出 ---
<html>
  <head>
    <title>Test</title>
  </head>
  <body>
    <p>Hello</p>
  </body>
</html>

MCP 整合

MCP(Model Context Protocol,模型上下文協議)讓 AI 代理和應用可以探索並呼叫 Coding.Tools 工具,用於可重複的轉換、格式化、雜湊和產生工作流程。

MCP 工具名稱: html-beautifier

MCP 端點: https://coding.tools/mcp

請先呼叫 tools/list。每個工具項目都包含 inputSchema、outputSchema 和 examples,AI 代理或客戶端可據此建立有效參數,不需要猜測。

呼叫 tools/call 後,result.content[0].text 是顯示用結果,result.structuredContent 是適合程式解析的結構化結果。工具層級失敗會回傳 isError: true;協議層級失敗會回傳 JSON-RPC error。

tools/call 請求範例:

curl -s https://coding.tools/mcp \
  -H "Content-Type: application/json" \
  -H "Accept: application/json" \
  -H "MCP-Protocol-Version: 2025-06-18" \
  -d '{"jsonrpc":"2.0","id":1,"method":"tools/call","params":{"name":"html-beautifier","arguments":{"input":"<section><h1>Docs</h1><p>MCP ready</p></section>"}}}'

大多數文字與資料工具接受 input 字串以及可選的 options。只依賴瀏覽器圖片 API 的圖片工具會用於探索,並在需要瀏覽器能力時返回網頁入口。