Intégrateur CSS pour email
Déplace CSS d'un bloc style vers les attributs style inline afin qu'il survive dans les clients de messagerie.
Intégrateur CSS pour email
La plupart des clients de messagerie supprimient ou ignorent CSS écrit dans un bloc <style> — Gmail est l'exemple le plus connu. La solution est de déplacer chaque règle vers l'élément qu'elle cible en tant qu'attribut style="", et c'est exactement ce que cet outil fait : collez du HTML avec un bloc <style> et obtenez le même code avec les styles intégrés, prêt à coller dans une campagne ou un modèle transactionnel.
La fusion respecte la spécificité CSS par défaut, donc une règle comme #footer l'emporte sur un simple sélecteur a même si cette règle apparaît plus tard dans la feuille de style — désactivez « Respecter la spécificité des sélecteurs » pour fusionner uniquement par ordre d'apparition. Les règles qui ne peuvent pas être intégrées — media queries, :hover, autres at-rules — ne sont jamais supprimées silencieusement : « Conserver les règles qui ne peuvent pas être intégrées » les laisse dans un bloc <style> réduit, tandis que « Supprimer le bloc <style> d'origine » décide si ce bloc est émis. « Ajouter les attributs width/bgcolor hérités » duplique width, height et background-color sur les attributs simples que les anciennes versions d'Outlook attendent, « Supprimer les classes et ID inutilisés » efface les sélecteurs que rien ne référence, et « Minifier la sortie » réduit l'espace blanc restant.
La prise en charge des sélecteurs couvre les sélecteurs de type, classe, ID et attribut, plus les combinateurs descendants et enfants — les motifs que les feuilles de style email réelles utilisent. L'attribut style="" existant d'un élément l'emporte toujours sur tout ce qui est fusionné, correspondant à la façon dont les navigateurs appliquent la cascade. Avec « Afficher les avertissements pour les propriétés non prises en charge » activé, les propriétés que de nombreux clients ignorent — float, position: fixed, transforms, box-shadow — sont signalées dans un commentaire en haut du résultat, pour que vous les détectiez avant d'envoyer un test.
Tout s'exécute localement dans votre navigateur : le HTML que vous collez n'est jamais chargé nulle part. Copiez le résultat, téléchargez-le en tant que fichier .txt ou envoyez-le directement à un autre outil pour continuer à le nettoyer.