Vous voulez savoir quels styles CSS sont actuellement utilisés sur une page Web.
Google Chrome propose deux méthodes pour vérifier la présence de CSS inutilisés .
1. Onglet Audit : > Cliquez avec le bouton droit de la souris et inspectez l'élément de la page, trouvez l'onglet "Audit" et lancez l'audit en vous assurant que la case "Performances de la page Web" est cochée.
Liste de toutes les balises CSS inutilisées - voir l'image ci-dessous.
Mise à jour : - - - - - - - - - - - OU - - - - - - - - - - - - - - - - - - - - -
2. Onglet Couverture : > Cliquez à droite + Inspecter l'élément sur la page, trouvez les trois points à l'extrême droite (encerclés dans l'image) et ouvrez le tiroir de la console (ou appuyez sur Esc), enfin cliquez sur les trois points à gauche dans le tiroir (encerclés dans l'image) pour ouvrir l'outil Couverture.
Chrome a lancé un outil permettant de visualiser les CSS et JS inutilisés. Mise à jour de Chrome 59 Permet de démarrer et d'arrêter un enregistrement (carré rouge dans l'image) pour permettre une meilleure couverture de l'expérience d'un utilisateur sur la page.
Affiche tous les CSS/JS utilisés et inutilisés dans les fichiers. - voir l'image ci-dessous.
Installer le Complément CSS Usage pour Firebug et l'exécuter sur cette page. Il vous dira quels styles sont utilisés et non utilisés par cette page.
@Harry , une fois que vous aurez installé ce plugin, il sera dans l'onglet faisant partie de firebug où vous avez net et all////. Faites-moi savoir si vous avez besoin d'autre chose.
Par souci d'exhaustivité et parce que la question a été posée dans les commentaires, l'outil d'audit CSS est également disponible dans le site Web de la Commission européenne. Chrome maintenant dans le même but. Quelques détails ici :
http://meeech.amihod.com/very-useful-find-unused-css-rules-with-google
Je ne suis pas sûr que l'"outil d'audit CSS" auquel cette réponse fait référence soit le même que l'outil d'audit CSS de la Commission européenne. Audits dans les outils de développement de Chrome, mais cela vous indiquera quelles règles CSS sont inutilisées (par exemple, "Some.css : 42% n'est pas utilisé par la page actuelle.").
Jetez un coup d'œil à UnCSS . Il permet de créer un fichier CSS des CSS utilisés.
Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
2 votes
Utilisez un navigateur qui dispose d'un inspecteur CSS. Safari et Chrome (alias Webkit) le proposent dans le cadre des outils de développement. Dans Firefox, il est fourni par le plugin Firebug. Internet Explorer n'a rien de semblable, à ma connaissance. L'inspecteur vous permettra de sélectionner un élément, de faire un clic droit et de choisir "Inspecter l'élément" - il vous montrera alors quels sélecteurs et quelles règles individuelles sont appliqués à l'élément que vous avez sélectionné.
0 votes
@Lee la barre d'outils du développeur d'ie8 se comporte de la même manière que firebug dans les sélecteurs css, vous pouvez sélectionner et voir les styles appliqués sur le côté droit.
0 votes
Duplication possible de Extraire uniquement le css utilisé dans une page spécifique