[Tuto] Inspecter les éléments Web avec votre navigateur

Retrouvez ici quelques tutoriels pour vos forums phpBB
Avatar du membre
Fred
Messages: 3166
Enregistré depuis: 4 ans 2 mois
Identité: Fred Rimbert
Localisation: Le Lude - Pays de la Loire
Intérêt: GitHub
Contact:

Inspecter les éléments Web avec votre navigateur

#1

Message par Fred »

Les sites Web sont construits à partir de lignes de code qui donnent des pages avec des images, des vidéos, des polices et d'autres fonctionnalités. Pour modifier l'un de ces éléments ou voir en quoi il consiste, il suffit de rechercher la ligne de code qui le contrôle.
Pour ce faire il faut utiliser utiliser un outil d'inspection d'élément, sans avoir besoin de télécharger un outil d'inspection ou d'installer un module complémentaire pour votre navigateur Web. Il y a juste à cliquer avec le bouton droit sur l'élément d'une page, puis sélectionner Inspecter ou Inspecter l'élément.
La façon dont vous accédez à cet outil varie cependant selon le navigateur.


Inspecter les éléments dans Google Chrome


Google Chrome a deux façons d'ouvrir son outil d'inspection :
  • Cliquer avec le bouton droit sur un élément de la page ou dans une zone vide, puis sélectionner Inspecter.
  • Aller au menu chrome, puis sélectionner Plus d'outils > Outils de développement.
Image



Inspecter les éléments dans Firefox


Mozilla Firefox a deux façons d'ouvrir son outil d'inspection :
  • Cliquer avec le bouton droit sur un élément de la page ou dans une zone vide, puis sélectionner Examiner l'élément.
  • Aller au menu Firefox, sélectionner Outils > Développement Web > inspecteur.
Image



Inspecter les éléments dans Safari


Safari a deux façons d'ouvrir son outil d'inspection :
  • Cliquer avec le bouton droit sur un élément de la page ou dans une zone vide, puis sélectionner Examiner l'élément.
  • Dans la barre de menus de Safari, sélectionner Développement > Afficher l'inspecteur web.
Image

Si vous ne voyez pas le menu Développement, accédez au menu "safari" et sélectionnez "Préférences".
Dans l'onglet "Avancées" cocher la case Afficher le menu Développement dans la barre des menus.

Image


Inspecter les éléments dans Brave


Brave a deux façons d'ouvrir son outil d'inspection :
  • Cliquer avec le bouton droit sur un élément de la page ou dans une zone vide, puis sélectionner Inspecter.
  • Aller au menu Brave, sélectionner Plus d'outils > Outils de développement.
Image



Inspecter les éléments dans Opéra


Opéra a deux façons d'ouvrir son outil d'inspection :
  • Cliquer avec le bouton droit sur un élément de la page ou dans une zone vide, puis sélectionner Inspecter l'élément.
  • Dans la barre de menus d'Opéra, sélectionner Développeur > Outils du développeur.
Image



Inspecter les éléments dans Microsoft Edge


Microsoft Edge a deux façons d'ouvrir son outil d'inspection :
  • Cliquer avec le bouton droit sur un élément de la page ou dans une zone vide, puis sélectionner Inspecter.
  • Dans la barre de menus de Microsoft Edge, sélectionner Outils > Développeur > Inspecter les éléments.
Image
Vous devez être membre du forum pour répondre
Inscrivez-vous pour participer au forum ou Connecter-vous à votre compte.