Astuces

Géneral

Capture d'écran:

Paramètres:

Inspecteur de page

Dans l'onglet Inspecteur:

Lors de la sélection des éléments:

  • Shift + clic pour séléctionner un élement en conservant la selection (Le mode sélection ne se désengage pas).
  • Utilisez / pour naviguer sur l'élement parent/enfant (si ils sont trop durs à sélectionner).

Dans la vue des règles CSS:

  • Cliquez sur l'icone d'inspection () à côté de n'importe quel sélecteur pour surligner tous les élements qui correspondent.
  • Cliquez sur l'icone d'inspection () à côté de la règle de l'element{} pour bloquer le surlignage sur l'élement courant.
  • Cliquez-droit sur n'importe quelle propriété et sélectionnez "Afficher la documentation MDN" pour voir la documentation MDN pour cette propriété.
  • Cliquez sur l'icone de filtre () à côté d'une propriété surchargée pour trouver quelle autre propriété la surcharge.
  • Cliquez-droit sur un nom, une valeur, une règle pour copier n'importe quel nom, valeur, déclaration ou la règle complète dans le presse-papier.

Console web

Dans tous les onglets:

  • Esc ouvre la console scindée utile lors du debug, ou l'inspection des noeuds.

Dans la ligne de commande:

Dans la sortie de la console:

Débogueur

  • Eviter les bibliothèques JavaScript durant la session de débogage via l'icone de boite noire (Icon for black boxing a JavaScript source).
  • Pressez Ctrl+Alt+F pour rechercher dans tous les scripts.
  • Pressez Ctrl+D pour rechercher la définition d'une fonction.
  • Pressez Ctrl+L pour aller à une ligne spécifique.

Editeur de feuilles de style CSS

  • L'icône de boite noire (Icon for black boxing a JavaScript source) du panneau des feuilles de style permet d'afficher ou de cacher une feuille de style.
  • Cliquez sur une règle @media  pour l'appliquer dans la Vue adaptative.
  • Cliquez sur le bouton d'import (Button to import a style sheet from the file system) pour importer une feuille de style ou le bouton de création (Button to create a new style sheet) pour en créer une nouvelle.
  • Cliquez sur le bouton d'option du panneau des feuilles de style et cliquez sur "Afficher les sources originales" pour basculer vers l'affichage des fichiers du pré-processeur CSS.

Réseau

Stockage

  • Cliquez-droit sur l'en-tête de la colonne pour ouvrir un menu permettant de changer l'affichage de la colonne.
  • Cliquez-droit sur une entrée et cliquez sur "Supprimer nom" pour la supprimer ou "Tout supprimer" pour supprimer toute les entrées.
  • Sélectionnez une entrée pour voir sa valeur dans la barre latérale.

Barre de développement

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : JeffD
 Dernière mise à jour par : JeffD,