Inspecteur

L’Inspecteur montre ce que le navigateur a réellement rendu pour un élément : tailles calculées, typographie, couleurs, espacements, layout et structure.

Modes d’inspection#

Mode	Comportement
Clic	L’élément sous le pointeur est encadré. Clique (ou appuie sur Entrée) pour le figer ; il reste dans le panneau jusqu’à ta prochaine sélection.
Survol	Le panneau suit ta souris en direct. Clique ou appuie sur Entrée pour figer l’élément courant.

Change de mode dans l’en-tête de l’Inspecteur, sur l’accueil, ou choisis le mode par défaut dans Réglages › Inspection. Appuie sur Échap pour arrêter. Tu peux aussi parcourir les éléments avec Tab et figer avec Entrée.

Onglets#

• Essentiel — largeur et hauteur rendues, typographie, couleurs et espacements.
• Layout — boîte, display, position et overflow.
• Style — remplissage et texte, bordure et forme, effets.
• Structure — la hiérarchie de la sélection : ses enfants directs, leur position et leur taille relatives à l’élément sélectionné, et le lien vers le squelette HTML nettoyé.

Chaque valeur a un bouton de copie. Les valeurs sont calculées par le navigateur au moment de la sélection : les règles CSS sources, les filtres et les pseudo-éléments ne sont pas capturés.

Préparer pour l’IA#

Préparer pour l’IA ouvre Avant d’envoyer, l’aperçu exact de ce qui sera copié — rien ne touche le presse-papiers avant ta confirmation. Le contenu suit l’onglet affiché (Essentiel, Layout, Style ou Structure), avec Contexte complet disponible dans l’aperçu. Voir Transmission à l’IA.

Cas particuliers#

• Iframes — une iframe est inspectée comme un conteneur. Ouvre directement sa page pour inspecter son contenu ; les iframes d’une autre origine sont protégées par le navigateur.
• Shadow DOM — dans une shadow root ouverte, le sélecteur est relatif à cette shadow root, pas au document.
• Formulaires — les valeurs de formulaire et le texte éditable sont toujours exclus.