Comprendre le rôle des feuilles de style de l'agent utilisateur

Question

Je travaille sur la page dans Google Chrome. Il affiche correctement les styles suivants.

tableau {
    affichage : tableau ;
    border-collapse : séparé ;
    espacement des bordures : 2 px ;
    couleur de la bordure : gris ;
}
Notez que je n’ai pas défini ces styles. Dans les outils de développement Chrome, il remplace le nom du fichier CSS par User Agent Stylesheet. 
Maintenant, si je soumets le formulaire et que des erreurs de validation se produisent, j'obtiens la feuille de style suivante : 
tableau {
    espace blanc : normal ;
    hauteur de ligne : normale ;
    poids de la police : normal ;
    taille de police : moyenne ;
    variante de police : normal ;
    style de police : normal ;
    couleur : -webkit-text ;
    alignement du texte : -webkit-auto ;
}

tableau {
    affichage : tableau ;
    border-collapse : séparé ;
    espacement des bordures : 2 px ;
    couleur de la bordure : gris ;
}
Le font-size dans ces nouveaux styles perturbe ma conception. Existe-t-il un moyen de forcer ma feuille de style, si possible, à remplacer complètement la feuille de style par défaut de Chrome ? 
            

Answer 1

Si est absent de votre contenu HTML, vous pouvez rencontrer une situation dans laquelle le navigateur donne la priorité aux « feuilles de style de l'agent utilisateur » par rapport à vos feuilles de style personnalisées. L'ajout d'un type de document résout ce problème.

Answer 2

Quel est le navigateur cible ? Différents navigateurs définissent différentes règles CSS par défaut. Essayez d'ajouter une réinitialisation CSS, telle que meyerweb CSS reset ou normalize.css, pour supprimer ces valeurs par défaut. Google "Réinitialisation CSS vs normalisation" pour voir la différence.