web-dev-qa-db-fra.com

Chrome Outils de développement: Comment savoir ce qui est prioritaire sur une règle CSS?

Eh bien, c'est assez simple. Si les outils de développement de Chrome m'indiquent qu'un style est remplacé, comment voir quelle règle CSS le remplace?

Je veux savoir s'il y a quelque chose comme "Montre-moi ce qui annule cette" .

OBS: S'il vous plaît, ne me dirigez pas vers Firebug.

187
ramonztro

Utilisez le panneau Style calculé de l'inspecteur d'éléments. Développez la propriété d'intérêt pour afficher la liste des règles applicables et celle qui a été gagnée.

Chrome screenshot

272
josh3736

Vous pouvez simplement regarder celles du même nom qui ne sont pas rayées, mais rappelez-vous que la liste est par importance.

Ou vous pouvez voir les styles calculés. Ils seront les styles réellement appliqués.

7
user1902091

ctrl + Maj + C et inspectez l'élément. Trouvez ensuite le style sans ligne, dans la case située dans le coin inférieur droit.

le remplacement est dans la plupart des cas au sommet (et sans une ligne à travers, car ce style est le "gagnant").

2
Peter Rasmussen