Windows 10 reached EOS (end of support) on October 14, 2025. If you are on Windows 10, see this article.

Avatar for Username

Caută ajutor

Atenție la excrocheriile de asistență. Noi nu îți vom cere niciodată să suni sau să trimiți vreun SMS la vreun număr de telefon sau să dai informații personale. Te rugăm să raportezi activitățile suspecte folosind opțiunea „Raportează un abuz”.

Află mai multe
Firul de discuție a fost arhivat. Adresează o întrebare nouă dacă ai nevoie de ajutor.
Rezolvat Arhivate

What is the modern way to style the Dev Tools area through userChrome.css

Firefox Setări
kensley.lewis răspuns
kensley.lewis
kensley.lewis

What is the modern way to style the Dev Tools area through userChrome.css? It appears that whatever techniques were used in 2018, don't apply today because I tried them all.

How should the CSS syntax look for styling the inspector, debugger, etc... (i.e. change the font size and font family types).

I'm on FireFox 97.0

Many thanks!

What is the modern way to style the Dev Tools area through userChrome.css? It appears that whatever techniques were used in 2018, don't apply today because I tried them all. How should the CSS syntax look for styling the inspector, debugger, etc... (i.e. change the font size and font family types). I'm on FireFox 97.0 Many thanks!

Toate răspunsurile (4)

cor-el
cor-el
  • Moderator

Soluție aleasă

It likely doesn't work because you need to place the code in userContent.css.

What CSS code did you try ?

kensley.lewis
kensley.lewis Deținătorul întrebării

Before you answered, I originally tried the following... 

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */

@-moz-document url-prefix(chrome: //devtools/content/) { 

 .devtools-monospace {
   font-family:arial !important;
   font-size: 20px !important;
   line-height:3;
 }

}

Any recommendations?

Modificat la de kensley.lewis

cor-el
cor-el
  • Moderator

This code in userContent.css should work. Do not add the @namespace line. 

@-moz-document url-prefix(chrome://devtools/content/) {
 .devtools-monospace {
   font-family:arial !important;
   font-size: 20px !important;
   line-height:3;
 }
}

kensley.lewis
kensley.lewis Deținătorul întrebării

Absolutely fantastic!

Thanks

Modificat la de kensley.lewis