Les outils de développeur Safari / chrome indiquent qu'une règle CSS est remplacée par quelque chose d'autre en la frappant, comme indiqué dans l'image.
Parfois, je me trouve dans une situation où je ne peux pas comprendre les fichiers CSS Qu'est-ce qui provoque l'ignorer cette règle. Mais sûrement safari lui-même doit savoir car il le frappe.
Y a-t-il un moyen de savoir ce qui remplace une telle règle?
5 Réponses :
Les outils de développement énuméreront toutes les règles d'un élément. Il suffit de lire toutes les règles CSS qui s'appliquent et vérifiez une non-frappée d'une personne avec le même nom.
Regardez celui qui n'est pas frappé, plus haut sur la liste.
Alternativement, affichez les styles calculés . Ce seront les styles appliqués définitifs.
Merci, j'avais manqué que Safari commande les blocs par l'importance, pas l'ordre CSS. Mon cas était que le sélecteur plus long (table.class TD) a été supérieur à celui plus court, bien que plus de sélecteur spécifique (.class) correspond à une seule TD.
Utilisez définitivement le volet styles calculé pour cela. Vous pourrez voir exactement la cascade qui a conduit au résultat calculé final.
Lorsque vous inspectez un élément, vous pouvez montrer la «case». En bas de cela, vous avez un «filtre» qui devrait vous montrer toutes les propriétés appliquées à votre élément.
Si vous cliquez sur une propriété, il vous donnera le fichier et le numéro de ligne.
aller aux éléments >> calculé et vous obtiendrez la feuille de style qui définit la règle que vous recherchez.
Allez à l'onglet onglet d'outils de développeur chromé. Trouvez des propriétés recherchées et développez Détails.
Dev Outils affiche la source de fichier en face du sélecteur.
Vous pourriez bénéficier de la lecture via une documentation d'aide sur les outils de développement de Chrome plutôt que d'attendre un guide rapide d'ici.