lacaliser un fichier via le panneau d’outils de développement

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !

Modérateur : Asumbaa

Mepromic
Arias
Messages : 1
Inscription : 10 juin 2018, 23:02

lacaliser un fichier via le panneau d’outils de développement

Message par Mepromic » 11 juin 2018, 08:09

Bonjour,
je voudrais savoir s'il est possible de trouver physiquement le fichier source d’un élément d’une page web ? En effet quand j'examine un bout de contenu texte (pas le css), j’arrive pas à trouver dans quel fichier source il se trouve sur mon disque dur …
Je travaille sur un site en local et j’utilise Firefox et son panneau d’outils de développement et il me semble que ça devrait une fonctionnalité de base de ce genre d’outils.
J’ai fait des recherches mais j’ai rien trouvé c’est pour çà que je poste ma demande ici en dernier recours. Merci si vous avez trouvé une solution pour régler ce problème,

Cordialement,

Gloops
Varan
Messages : 1960
Inscription : 22 mai 2006, 11:55

Re: lacaliser un fichier via le panneau d’outils de développement

Message par Gloops » 26 juil. 2018, 22:49

Bonjour,
Après avoir appuyé sur F12, regarde dans le débogueur si c'est ce que tu cherches.

lilou2093
Arias
Messages : 5
Inscription : 16 août 2018, 21:12

Re: lacaliser un fichier via le panneau d’outils de développement

Message par lilou2093 » 18 août 2018, 13:10

Comment faire pour que cette sous-fenêtre apparaisse ? Trois méthodes :

Au clavier. Ctrl + Shift + I, sauf pour :
Internet Explorer. F12
Mac OS X. ⌘ + ⌥ + I
Via les menus.
Firefox. Menu ➤ Développement ➤ Outils de développement ou Outils ➤ Développement Web ➤ Outils de développement
Chrome. Affichage ➤ Développement ➤ Outils de développement
Safari. Développement ➤ Afficher l'inspecteur web. Si vous ne pouvez pas voir le menu Développement, aller sous Safari ➤ Préférences ➤ Avancé et vérifiez que l'option Afficher le menu de développement est bien coché.
Opera. Développement ➤ Inspecteur web
Via un menu contextuel. Cliquez-droit sur un élément de la page web (ou ctrl+clic sur Mac) et sélectionnez Examiner l'élément dans le menu qui apparait (Bonus : cette méthode ouvrira l'inspecteur et sélectionnera directement l'élément en question !).
8 Ball Pool
Si vous n'arrivez pas sur l'inspecteur :
Cliquez ou appuyez l'onglet Inspecteur.
Sous Internet Explorer, cliquez ou appuyez sur Explorateur DOM, ou appuyez sur Ctrl + 1.
Sous Safari, les contrôles n'apparaissent pas clairement mais vous devriez voir le code HTML si vous n'avez rien sélectionné d'autre. Pour voir le code CSS, appuyez sur le bouton Style.
Google Hangouts
Pour commencer, cliquez-droit sur un élément HTML dans l'inspecteur du DOM et regardez le menu contextuel qui s'affiche. Les options du menu qui apparaît peuvent varier d'un navigateur à un autre mais les options les plus importantes s'y trouvent toujours :
Supprimer le nœud (parfois Supprimer l'élément) : supprime l'élément sélectionné du document.
Modifier comme HTML (parfois Ajouter un attribut/Éditer le texte) : permet de changer le HTML et de voir le résultat obtenu à la volée (en live). Cette option est très utile pour déboguer ou tester.
:hover/:active/:focus : force l'état d'un élément à être actif afin de pouvoir voir ce que la mise en forme donne pour cet état.
Copier/Copier comme HTML : permet de copier l'élément HTML actuellement sélectionné. Omegle
Certains navigateurs disposent également d'options comme Copier le chemin CSS et/ou Copier le chemin XPath qui permettent de copier le sélecteur CSS ou l'expression XPath qui permettrait de sélectionner l'élément HTML en cours.

Gloops
Varan
Messages : 1960
Inscription : 22 mai 2006, 11:55

Re: lacaliser un fichier via le panneau d’outils de développement

Message par Gloops » 18 août 2018, 19:46

Si on veut avec Firefox on peut aussi faire un clic droit sur un élément de la page, et cliquer sur Examiner l'élément.
Comme l'intitulé l'indique le focus sera sur le code de l'élément visé.
Bon, on va voir au retour de Mepromic ...

Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 1 invité