Éditeur HTML et CSS

Comment utiliser l’éditeur HTML

Cet éditeur sert aux petits contenus statiques, tableaux ou essais CSS. Le texte pâle des champs HTML et CSS est un exemple dont le premier aperçu montre le résultat. Sélectionner un champ d’exemple le vide pour votre saisie. Si vous le quittez vide, l’exemple pâle revient sans restaurer un ancien résultat ni activer l’export.

Saisissez votre propre balisage et vos styles. Vous pouvez coller un fragment ou un document HTML complet. L’éditeur reconstruit un document statique avec les éléments pris en charge ; les métadonnées ne sont pas conservées. Une fois la saisie commencée, seul votre vrai contenu est utilisé, sans y mélanger l’exemple pâle d’un autre champ vide. Votre texte reste intact lorsque vous changez de champ.

Ce que représente l’aperçu

L’aperçu est une page isolée. Il affiche le HTML pris en charge et votre CSS sans modifier l’éditeur lui-même. Vous pouvez examiner textes, titres, listes, tableaux, contrôles de formulaire ordinaires et mises en page CSS. Si le contenu dépasse la zone disponible, faites défiler l’aperçu. Sa largeur suit celle du panneau : ce n’est pas un simulateur d’appareil de taille fixe.

JavaScript, gestionnaires d’événements, pages intégrées, SVG, lecteurs multimédias et ressources externes sont exclus ou bloqués. Les liens ne naviguent pas et les formulaires ne sont pas envoyés. Les images, polices, feuilles de style et imports CSS distants ne chargent pas. Les images PNG, JPEG, GIF et WebP intégrées en base64 sont admises. Un avis compte les éléments ou attributs retirés ; la politique du document bloque les références externes du CSS. Les entrées originales restent disponibles pour révision.

Deux petits exemples

Saisissez le HTML et le CSS suivants pour obtenir le titre « Hello » en vert foncé. Modifiez le texte entre les balises pour changer les mots, ou la couleur CSS pour changer leur apparence.

Pour une liste, utilisez <ul><li>Plan</li><li>Review</li></ul> et li { margin-bottom: 8px; }. Deux puces apparaissent avec un espace après chaque élément. Cela permet de vérifier un petit bloc avant de l’intégrer à votre projet.

HTML: <h1>Hello</h1>
CSS:  h1 { color: #166534; }

Copier et télécharger

Copier HTML et Exporter HTML utilisent le même document statique actuel que l’aperçu. Le fichier UTF-8 page.html rassemble le balisage compatible, le CSS et une politique de contenu restrictive. Ouvrez-le dans un navigateur pour l’afficher ou dans un éditeur de texte pour examiner son code. Il s’agit d’un brouillon statique autonome, pas d’un site hébergé ni d’une application avec des scripts actifs.

Effacer supprime votre HTML, CSS et résultat, avec confirmation si du code a été saisi. Les champs vides montrent de nouveau des exemples pâles, pas des données enregistrées. La saisie utilise les fonctions habituelles du navigateur. La page avertit avant de quitter après modification, sans sauvegarde automatique. Téléchargez le HTML statique pour conserver le résultat pris en charge.

Limites et dépannage

La limite commune est de 100 000 caractères, 3 000 nœuds HTML et 64 niveaux imbriqués. En cas de dépassement, le texte reste visible et l’aperçu comme l’export sont désactivés jusqu’à réduction. Une entrée vide ne produit aucun fichier.

Les navigateurs corrigent souvent les balises non fermées et ignorent les déclarations CSS invalides. Cet outil n’est pas un validateur de normes : un aperçu visible ne prouve ni validité, ni accessibilité, ni aptitude à la production. Vérifiez les sélecteurs, la syntaxe et les éventuelles ressources distantes bloquées. Utilisez les outils de développement dans votre propre projet pour un diagnostic complet.

Questions fréquentes