Aller au contenu

Wullfk Blog

  • entries
    192
  • comments
    122
  • views
    814 765

Visualiser en direct les changements effectués dans le fichier userChrome.css de FF 57

Wullfk

3 173 vues

Utilisation de l'outil Développement Web pour visualiser en direct les modifications effectuées dans le fichier userChrome.css

 

Basiquement lorsque que l'on modifie le fichier userChrome.css, on rentre un code, puis on relance Firefox pour voir le résultat. On répète cette manip à chaque ajout ou modification du code CSS jusqu'à obtention du résultat recherché.

 

Pour la personnalisation de Firefox Quantum (57) par code CSS voir l’article suivant : Astuces de personnalisations de Firefox Quantum (hors extensions)

 

Pour éviter cette relance systématique de Firefox pour visualiser le résultat d'une modification du code CSS il suffit d'utiliser les Outils de Développement Web inclus dans Firefox 57.

 

Dans about:config, rechercher l'option :

 

devtools.debugger.prompt-connection = mettre à False (True par défaut)

 

À présent

 

Ouvrir le Menu Hamburger (3 barres horizontale) >> "Développement Web" >> "Outils de développement".

 

ob_10751d_diteur-de-style-dans-firefox-57-00.pngob_dd6e5d_diteur-de-style-dans-firefox-57-01.png

 

Cliquer sur la roue dentée à droite du panneau qui s'ouvre pour accéder aux réglages.

Cocher "Activer le débogage du chrome du navigateur et des modules" et "Activer le débogage distant" en bas du panneau, à droite. Fermer le panneau.

 

ob_5c4b78_diteur-de-style-dans-firefox-57-02.png

 

Il est maintenant possible de lancer la boîte à outils par : Menu Hamburger >> Développement Web >> Boîte à Outils du navigateur >> OK

 

ob_42d9b0_diteur-de-style-dans-firefox-57-04.png

 

La boîte s'ouvre >> Sélectionner l'onglet "Éditeur de style" >> chercher userChrome.css dans colonne de gauche.

 

ob_dccc2d_diteur-de-style-dans-firefox-57-05.png

 

On peut dès lors éditer le fichier, le modifier et voir les résultats en direct. Lorsque le résultat convient, on enregistre le fichier.

 

Adaptation source originale : https://www.forum-francophone-linuxmint.fr/viewtopic.php?p=95716#p95716

 

 



0 Commentaire


Commentaires recommandés

Il n’y a aucun commentaire à afficher.

Join the conversation

You are posting as a guest. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Invité
Add a comment...

×   Collé en tant que texte enrichi.   Coller en tant que texte brut à la place

  Seulement 75 émoticônes maximum sont autorisées.

×   Votre lien a été automatiquement intégré.   Afficher plutôt comme un lien

×   Votre contenu précédent a été rétabli.   Vider l’éditeur

×   Vous ne pouvez pas directement coller des images. Envoyez-les depuis votre ordinateur ou insérez-les depuis une URL.

×
×
  • Créer...