Formateur HTML
Embellit ou minifie le HTML, met en forme le CSS/JS en ligne et prévisualise le résultat.
Votre HTML est embelli, minifié et prévisualisé entièrement dans votre navigateur — rien n'est envoyé à un serveur.
Vous nettoyez aussi des feuilles de style ? Essayez le Formateur CSS.
À propos de Formateur HTML
Ce formateur html embellit ou minifie le balisage brut et formate automatiquement tout CSS et JavaScript en ligne avec Prettier. Collez une sortie de gabarit désordonnée, des pages extraites ou du balisage écrit à la main et obtenez un HTML propre et indenté de façon cohérente en une étape, ou passez en mode minify pour retirer les espaces et réduire le document en production. Un aperçu en bac à sable vous permet de rendre le balisage en toute sécurité avec les scripts désactivés, les scripts intégrés ne s'exécutent donc jamais. En tant qu'embellisseur et prettifieur html, il est conçu pour les développeurs front-end, ingénieurs QA et quiconque a besoin de formater html en ligne sans changer de contexte. Tout s'exécute localement dans votre navigateur, vos données ne quittent jamais votre appareil. Choisissez tabulations ou espaces pour l'indentation afin de correspondre au style de votre projet.
Fonctionnalités
- Embellit le HTML avec une indentation cohérente et lisible
- Minifie le HTML pour retirer les espaces et réduire la sortie
- Formate les blocs <style> et <script> en ligne via Prettier
- L'aperçu en bac à sable rend le balisage avec les scripts désactivés
- Basculez entre tabulations et espaces pour l'indentation
- Gère les pages complètes ou les extraits de balisage partiels
- Copiez la sortie formatée ou minifiée en un clic
- Tout s'exécute dans votre navigateur
Comment utiliser Formateur HTML
- Collez votre HTML dans la zone de saisie.
- Choisissez Embellir pour formater, Minifier pour compresser, ou Aperçu pour le rendre.
- Activez ou désactivez Tabulations pour définir votre style d'indentation.
- Copiez le HTML formaté ou minifié depuis le panneau de sortie.
Exemple
Entrée
<div class="card"><h1>Salut</h1><p>Bonjour le monde</p></div>
Sortie
<div class="card">
<h1>Salut</h1>
<p>Bonjour le monde</p>
</div>
Le mode embellir réindente le balisage et normalise les espaces.
Erreurs courantes et dépannage
- Les scripts intégrés ne s'exécutent pas dans l'aperçu. — C'est intentionnel — l'aperçu est une iframe en bac à sable avec les scripts désactivés pour que les pages se rendent en toute sécurité. Testez le code interactif dans votre propre environnement.
- Le CSS ou JS en ligne n'est pas reformaté. — Assurez-vous que le code est dans des balises <style> ou <script> correctes ; Prettier ne formate que les blocs en ligne reconnus lors de l'embellissement.
- Des balises malformées ou non fermées produisent une indentation inattendue. — Fermez les balises non concordantes dans votre source — le formateur réorganise une structure valide mais ne peut pas deviner l'imbrication voulue.
- La sortie minifiée est difficile à lire. — Revenez au mode Embellir ; la minification est destinée à la taille en production, pas à la lisibilité.
Foire aux questions
- Qu'est-ce que le Formateur HTML ?
- Le Formateur HTML est un outil dans le navigateur qui embellit ou minifie le balisage HTML avec Prettier, formate le CSS et JavaScript en ligne, et prévisualise le résultat dans une iframe en bac à sable.
- Comment embellir du HTML minifié ?
- Collez votre HTML minifié dans la zone de saisie et choisissez Embellir. Le Formateur HTML réindente le balisage et reformate tous les blocs <style> et <script> en ligne pour la lisibilité.
- Le Formateur HTML formate-t-il le CSS et le JavaScript en ligne ?
- Oui. Prettier formate automatiquement les blocs <style> et <script> dans le cadre de l'embellissement de la page.
- Puis-je minifier le HTML en plus de l'embellir ?
- Oui. Passez en mode Minifier pour retirer les espaces et produire le plus petit balisage équivalent pour la production.
- Puis-je choisir des tabulations au lieu d'espaces ?
- Oui. Activez l'option Tabulations dans le Formateur HTML pour indenter avec des tabulations, ou laissez-la désactivée pour utiliser des espaces.
- Mon HTML est-il envoyé quelque part lorsque je le formate ?
- Non. Tout le formatage et le rendu de l'aperçu se font localement dans votre navigateur, votre balisage ne quitte jamais votre appareil.
Outils associés
- Formateur CSS / SCSS — Embellit ou minifie CSS/SCSS/LESS, trie les propriétés et supprime les doublons.
- Formateur JS / TS — Embellit ou minifie JavaScript, TypeScript et JSX/TSX avec les options de Prettier.
- Formateur XML — Embellit, minifie et valide le XML, et convertit XML ↔ JSON.
- Échapper / Déséchapper HTML — Échappe et déséchappe les caractères spéciaux et entités HTML.
- Aperçu Markdown — Rend le Markdown en HTML avec un aperçu en direct.
- Optimiseur SVG — Minifie le SVG : supprime commentaires, métadonnées et résidus d’éditeur, et réduit les espaces.
- Formateur JSON — Embellit, minifie et valide le JSON avec la localisation des erreurs.
- Formateur SQL — Met en forme le SQL pour MySQL, PostgreSQL, SQL Server, SQLite, BigQuery et Oracle.
Tous les outils ArrayKit