Sommaire
Le navigateur Google Chrome est rempli de tonnes d’excellents outils pour vous aider à vous déplacer et à exécuter des fonctions sur le web. L’une des fonctions les plus utiles que propose Chrome est l’outil Inspecter l’élément.
Vous pouvez utiliser l’outil Inspecter l’élément dans Chrome pour inspecter le code source HTML d’un élément visuel sur n’importe quelle page web lorsque vous êtes sur un ordinateur.
Voici comment utiliser l’outil “Inspect Element” dans Chrome.
Utiliser l’outil d’inspection des éléments sur Chrome
Vous pouvez utiliser l’outil “Inspect Element” de Google Chrome de deux manières.
Comment utiliser l’élément d’inspection dans le chrome
La façon la plus simple de lancer l’outil “Élément d’inspection” est de cliquer avec le bouton droit de la souris sur une page web. Ensuite, il suffit de cliquer sur l’option “Inspecter” en bas de la liste. Habituellement, l’élément est lancé par défaut.
Sinon, vous pouvez cliquer sur l’onglet “Element” en haut de Chrome.
Si vous utilisez un Mac, vous devriez pouvoir accéder à ce menu avec CMD+clic et en sélectionnant “Inspecter”.
Comment inspecter des éléments avec les outils de développement
Lancer Inspect Elements, c’est lancer les “Developer Tools” de Google Chrome. Ouvrez les paramètres “Plus” dans Chrome, cliquez sur Plus d’outils, puis sur Outils pour les développeurs.
Cliquez sur l’icône à trois points. Cette icône est située à côté de la barre d’adresse dans le coin supérieur droit de votre fenêtre de navigateur. Elle ouvre un menu déroulant.
Lorsque vous cliquez sur le menu à trois points, une fenêtre pop-up apparaît. Survolez l’option “Plus d’outils” et un autre sous-menu apparaîtra.
Cliquez sur “Developer Tools” dans le sous-menu “More Tools”. Cela ouvrira la colonne Inspecteur sur le côté droit de votre fenêtre de navigateur, ou sous votre fenêtre de navigateur, selon votre configuration.
Note :Vous pouvez également ouvrir l’outil Inspecteur avec un raccourci clavier. Ce raccourci est Option+⌘ Cmd+I sur Mac, et Ctrl+Alt+I sur Windows.
Vous pouvez maintenant survoler un élément dans la case de la colonne Inspecteur. Si vous déplacez votre souris sur un élément ou une ligne dans Inspector, l’élément correspondant sélectionné sera mis en évidence sur la page web.
Lorsque vous mettez en évidence l’élément que vous souhaitez inspecter, il vous suffit de cliquer dessus. La colonne d’inspection correcte apparaîtra automatiquement sur la droite et vous pourrez consulter tout le code source.
C’est tout. Vous savez maintenant comment utiliser l’outil Inspecter l’élément dans Chrome pour inspecter le code source HTML d’un élément visuel sur n’importe quelle page web lorsque vous êtes sur un ordinateur.
