🌐

format HTML

Định dạng và rút gọn mã HTML với thụt lề tùy chỉnh.

Công cụ nhà phát triển Chạy cục bộ Không gửi dữ liệu
HTML làm đẹp rút gọn định dạng
Thụt lề:
HTML đầu vào
0 ký tự
→
Đầu ra
0 ký tự
Lưu ý: Chế độ định dạng dùng js-beautify để in đẹp HTML với thụt lề tùy chỉnh. Chế độ rút gọn loại bỏ chú thích và gộp khoảng trắng. Toàn bộ xử lý chạy hoàn toàn trong trình duyệt của bạn — không gửi dữ liệu đến máy chủ nào.

HTML Formatter là gì?

HTML Formatter biến mã đánh dấu bị nén hoặc không nhất quán thành HTML dễ đọc, được thụt lề đúng cách. Công cụ hữu ích để gỡ lỗi cấu trúc trang, xem lại mẫu và chuẩn bị đoạn mã cho tài liệu hoặc đánh giá mã mà không gửi mã đến máy chủ.

Cách sử dụng format HTML

  1. Dán HTML của bạn vào khung nhập.
  2. Chọn định dạng hoặc rút gọn mã đánh dấu.
  3. Điều chỉnh tùy chọn thụt lề nếu cần.
  4. Sao chép kết quả đã làm sạch để chỉnh sửa, xem lại hoặc triển khai.

Công cụ liên quan

🎨
Trình định dạng CSS
Làm đẹp hoặc minify mã CSS với định dạng tùy chỉnh
 📝
Công cụ định dạng JS
Làm đẹp hoặc thu gọn mã JavaScript với định dạng kiểu Prettier
 🏷️
mã hóa HTML entity
Mã hóa hoặc giải mã thực thể HTML — dạng tên và dạng số
Tìm hiểu HTML Formatter ▾
Ví dụ
Đầu vào <div><p>Hello</p><ul><li>Item</li></ul></div>
Đầu ra <div> <p>Hello</p> <ul> <li>Item</li> </ul> </div>
Các trường hợp sử dụng phổ biến
  • Làm đẹp HTML đã rút gọn được sao chép từ đầu ra bản dựng hoặc trang production
  • Xem lại cấu trúc markup lồng nhau trước khi chỉnh sửa template hoặc component
  • Làm sạch HTML do CMS hoặc WYSIWYG tạo ra trước khi xuất bản
  • Rút gọn lại các đoạn HTML sau khi gỡ lỗi hoặc chỉnh sửa thủ công
Vì sao nên dùng công cụ này
  • Giúp cấu trúc HTML lồng nhau dễ nhìn và gỡ lỗi hơn nhiều.
  • Hữu ích cho cả việc làm đẹp markup và rút gọn lại sau khi chỉnh sửa.
  • Chạy cục bộ nên template và đoạn mã không bị tải lên bất cứ đâu.
Câu hỏi thường gặp
HTML Formatter có xác thực HTML của tôi không?

Công cụ định dạng tập trung vào thụt lề và khả năng đọc. Nó sẽ xử lý HTML không đúng định dạng tốt nhất có thể, nhưng không phải trình xác thực nghiêm ngặt. Hãy dùng trình xác thực chuyên dụng nếu bạn cần kiểm tra tuân thủ đặc tả.

Việc định dạng có làm thay đổi kết quả hiển thị của trang tôi không?

Không. Thêm khoảng trắng giữa các phần tử block không làm thay đổi cách hiển thị trực quan. Hãy cẩn thận với các phần tử inline như <span> bên trong văn bản, nơi khoảng trắng có thể quan trọng, nhưng trình định dạng vẫn giữ nguyên nội dung inline.

Tôi có thể định dạng toàn bộ tài liệu HTML có <!DOCTYPE> và <head> không?

Có. Trình định dạng xử lý tài liệu đầy đủ bao gồm khai báo doctype, phần head, script và style mà không loại bỏ bất kỳ nội dung nào.

Có giới hạn kích thước tệp không?

Không có giới hạn phía máy chủ vì mọi thứ chạy trong trình duyệt của bạn. Các tệp rất lớn (hàng trăm KB) có thể mất một chút thời gian để xử lý tùy thuộc vào thiết bị của bạn.