Pour inspecter un élément, faites un clic droit dessus et choisissez « Inspecter » dans Chrome, Firefox ou Edge. Dans Safari, activez d’abord les fonctionnalités de développement web, puis faites un clic droit (ou un clic avec la touche Ctrl enfoncée) et choisissez « Inspecter l’élément » . Le navigateur ouvre ses outils et sélectionne l’élément dans l’arborescence du document. Chrome et Edge nomment ce panneau « Éléments » , Firefox « Inspecteur » et Safari « Inspecteur web » .
Vous pouvez également utiliser le menu à trois points de Chrome : Plus d’outils > Outils de développement . Raccourcis : F12 ou Ctrl+Maj+I (Windows/Linux), et Commande+Option+I (Mac). Appuyez sur Ctrl+Maj+C ou Commande+Maj+C pour ouvrir Elements en mode de sélection de page.
Vous pouvez également sélectionner Paramètres et plus (…) > Plus d’outils > Outils de développement . Appuyez sur F12 ou Ctrl+Maj+I (Windows/Linux), et sur Commande+Option+I (Mac), pour rouvrir le dernier panneau des outils de développement. Les raccourcis personnalisés peuvent varier.
Ouvrez les outils de développement avec F12 ou Ctrl+Maj+I (Windows/Linux), ou Commande+Option+I (Mac). Ctrl+Maj+C ou Commande+Option+C ouvre l'inspecteur. Si un site remplace le menu contextuel (clic droit), utilisez un raccourci clavier ou le menu de Firefox.
L'inspecteur web sélectionne l'élément cliqué. Vous pouvez également choisir Développement > Afficher l'inspecteur web ou appuyer sur Option + Commande + I pour l'ouvrir pour la page actuelle. Ces étapes s'appliquent à Safari sur Mac.
La ligne en surbrillance correspond à un nœud de l'arborescence DOM. Développez sa flèche pour afficher les éléments imbriqués, ou cliquez sur l'icône de sélection d'éléments, survolez la page et sélectionnez une cible. Le sélecteur est particulièrement utile pour les éléments petits ou superposés.
Utilisez le panneau Styles (appelé Règles dans Firefox) pour voir quelles déclarations CSS s'appliquent et d'où elles proviennent. Décochez une déclaration ou modifiez une valeur pour prévisualiser les changements de mise en page, de couleur, d'espacement ou de typographie. Cela ne modifie pas les fichiers du site ni ce que voient les autres visiteurs.
Chaque navigateur propose une fonction d'aperçu adaptatif ou sur appareil. Choisissez ou saisissez une taille de fenêtre plus étroite, puis inspectez le même DOM et les mêmes styles. Cela peut révéler des problèmes de points de rupture et de mise en page, mais ne remplace pas les tests sur des appareils réels.
| Navigateur | Ouvrir les outils de développement | Inspecter un élément de page |
|---|---|---|
| Chrome | F12 ou Ctrl+Maj+I ; Mac : Commande+Option+I | Ctrl+Maj+C ; Mac : Commande+Maj+C |
| Firefox | F12 ou Ctrl+Maj+I ; Mac : Commande+Option+I | Ctrl+Maj+C ; Mac : Commande+Option+C |
| Safari | Option+Commande+I sur Mac | Clic droit/Clic avec la touche Ctrl > Inspecter l'élément |
| Bordure | F12 ou Ctrl+Maj+I ; Mac : Commande+Option+I | Utilisez l'icône de sélection dans les outils de développement. |
Les raccourcis peuvent varier selon le système d'exploitation, la version du navigateur ou les paramètres personnalisés. Si un raccourci ne fonctionne pas, utilisez le menu du navigateur ou la commande du menu contextuel.
Les modifications courantes effectuées dans les panneaux Éléments, Inspecteur ou Styles sont temporaires et ne s'appliquent qu'à votre navigateur. Le rechargement de la page rétablit généralement la version fournie par le site. Certains outils de développement permettent d'enregistrer des modifications locales sur votre ordinateur, mais même dans ce cas, les changements ne sont pas publiés sur le serveur du site web. Considérez les outils de développement comme un moyen d'examiner et de tester une page, et non comme un moyen de modifier un site en ligne pour tous les utilisateurs.
Pour plus de détails, consultez le guide officiel des outils de développement Chrome , les raccourcis Firefox , le guide de configuration et d'inspection de Safari d'Apple et la présentation de Microsoft Edge .
Découvrez ce que signifie la métaphore des « quêtes annexes » en ligne, comment essayer des loisirs et des communautés sur différentes applications, et comment protéger votre vie privée, votre temps et vos limites.
Découvrez comment les extraits de processus, les journaux de production et les enregistrements rapides peuvent renforcer la confiance, et comment les comparer équitablement à une vidéo finalisée.
Explorez des façons agréables et peu coûteuses de ralentir le rythme dans un monde hyperconnecté, d'établir des limites numériques plus douces et de profiter des routines quotidiennes sans transformer le calme en une nouvelle séance de shopping.
Découvrez comment TikTok et YouTube apportent leur aide avec des tutoriels, des produits, des conseils de voyage et des réponses aux questions du quotidien, et comment vérifier les dates, les partenariats et les affirmations importantes.
Découvrez comment les créateurs réinterprètent la musique, la typographie, les couleurs, la mode et les textures vidéo des années 1970 et 1980 pour le public américain, en tenant compte du contexte culturel et des droits.
Comparez Reddit, Substack et Discord selon les critères de découverte, de modération, d'identité, de coût et de portabilité de l'audience, avec un guide pratique pour les lecteurs et les créateurs.
La culture du chaos décrit des vidéos rapides, complexes et remixables ; il ne s’agit pas d’une règle selon laquelle tous les spectateurs de la génération Alpha préfèrent le même style. Découvrez ses caractéristiques, ses limites et une liste de contrôle pratique pour les créateurs.
Trouvez des fonds d'écran animés gratuits pour Android : horloges et panneaux d'état personnalisés, illustrations rotatives, scènes changeantes et effets photo Pixel, ainsi que des conseils d'installation.
Bloquez quelqu'un sur TikTok via le menu Partager, gérez les commentaires indésirables, consultez votre liste de personnes bloquées et découvrez ce que le blocage masque et ce qu'il ne masque pas.
Comparez 11 serveurs DNS publics gratuits, dont Cloudflare, Google et Quad9, avec des adresses vérifiées, des options de filtrage et des conseils de configuration pour Windows 11.
