Langkau ke kandungan utama
LibraTool logoLibraTool

Pemercantik & Pemampat HTML percuma

Cetak cantik atau mampatkan HTML dengan inden bersarang yang betul. Memelihara kandungan di dalam blok <pre>, <script>, <style>.

Berfungsi luar talian selepas dimuatkan

Lepaskan fail di sini, atau klik untuk semak imbas

HTML, HTM Β· diproses pada peranti anda

atau tekan Ctrl+V untuk menampal daripada papan keratan

Layar fail
HTML yang diperindah
Output akan muncul di sini…

Kegunaan biasa

  • Sahut HTML yang Dijana PelayanLihat keluaran HTML mentah dari pelayan anda (PHP, Rails, Django, Node) dalam format boleh dibaca dengan indentasi.
  • Format Templat Email HTMLEmail HTML adalah terperinci (jadual, gaya sebaris). Format untuk membuatnya boleh disunting dan boleh diselenggara.
  • Format Halaman HTML StatikFail HTML statik yang disunting secara manual mendapat manfaat daripada pemformatan yang konsisten untuk penyuntingan kolaboratif.
  • Bersihkan HTML yang Dieksport CMSWordPress, Wix, Squarespace mengeksport HTML dengan banyak artifak. Format untuk membuatnya boleh disunting.
  • Minifikasikan HTML untuk PengeluaranKurangkan saiz fail HTML untuk pemuatan halaman yang lebih pantas dengan membuang ruang putih dan aksara yang tidak perlu.

Cara ia berfungsi

Alat ini memformat atau memampat HTML menggunakan penoken sedar-tag tulisan tangan dibina terus ke dalam halaman β€” tiada pustaka pemformatan pihak ketiga, tiada pergi-balik pelayan. Setiap aksara markup anda diproses secara tempatan dalam pelayar seketika anda menaip atau menampalnya.

  1. 1
    Penoken mengimbas markup
    Pengimbas tersuai aksara-demi-aksara melalui rentetan HTML, mengenal pasti komen, pengisytiharan DOCTYPE, tag pembuka, tag penutup, elemen kosong tutup-sendiri (br, img, input, dll.), dan nod teks mentah. Pembantu khusus menjejaki nilai atribut bertanda petik supaya aksara seperti > di dalam atribut (cth. value="a>b") tidak pernah menyebabkan tag terbelah awal.
  2. 2
    Kedalaman inden dijejak setiap tag
    Untuk mod indah, penoken mengekalkan pembilang kedalaman. Tag pembuka tahap-blok meningkatkan kedalaman; tag penutup menurunkannya sebelum ditulis. Elemen sebaris (span, a, strong, em, dll.) dikekalkan pada baris sama seperti kandungannya dan bukan ditolak ke barisnya sendiri berinden. Tag seperti pre, script, style, dan textarea mempunyai kandungan dalamannya dikeluarkan verbatim untuk mengelak merosakkan ruang putih-sensitif atau kod boleh laksana.
  3. 3
    Minifier meruntuhkan ruang putih dengan selamat
    Dalam mod minify, kandungan blok pre, script, style, dan textarea ditukar dengan penanda bernombor sebelum sebarang keruntuhan ruang putih berlaku. Komen HTML dibuang, dan larian ruang putih antara tag dibuang β€” kecuali antara elemen sebaris bersebelahan, di mana satu ruang dikekalkan supaya perkataan tidak bercantum bersama. Pemegang tempat penanda kemudian dipulihkan kepada kandungan asalnya.
  4. 4
    Output dipaparkan dan pilihan disimpan
    Hasil diformat atau diminify muncul secara langsung dalam panel output bersebelahan peratusan perubahan saiz. Anda boleh salinnya ke papan keratan atau muat turunnya sebagai fail .html, semuanya tanpa meninggalkan pelayar.

Alat berkaitan

🎨

Pemercantik CSS

Kemaskan CSS yang telah dikecilkan dengan inden yang konsisten, atau kecilkan CSS. Pilihan menyusun sifat mengikut abjad untuk perbandingan perubahan yang lebih mudah dijangka.

Cuba
πŸ—œοΈ

Pemampat & Pemformat CSS

Mampatkan CSS untuk mengurangkan saiz fail atau cantikkan CSS yang dimampatkan untuk kebolehbacaan. Segera, dalam pelayar anda.

Cuba
πŸ“°

Pemformat & Pengesah XML

Cetak cantik dan sahkan XML menggunakan penghurai DOM asli pelayar anda. Termasuk output yang dimampatkan untuk kegunaan pengeluaran.

Cuba

Soalan lazim