Збільште розмір шрифту коду в інструменті розробника Firefox

Як збільшити шрифти коду в інструментах розробника Firefox? Я знаю, що існує функція масштабування, але я хочу встановити розмір шрифту лише для коду.

Вам потрібно змінити userChrome.cssпід ~/.mozilla/firefox/[profile-name]/chromeцим:

/*  Styles for Web developer tools */
@namespace url(http://www.w3.org/1999/xhtml);
.CodeMirror {
    font-family:    "Ubuntu Mono", monospace !important;
    font-size:      15pt !important;
}

Результат виглядає так:

Це змінює лише налагоджувач та редактор стилів. Для інспектора html існує інший селектор. Ще не впевнений, що це.

1. Відкрийте Інструменти розробника Firefox
2. Натисніть Ctrl+ +на Unix / Win або Cmd+ +на Mac.

Щоб бути зрозумілим, я маю на увазі +ключ. Вам не потрібно затримувати Shiftчас, роблячи це.

Відкрийте Firefox і введіть about:support. У розділі Основи програми обрали папку профілю - Відкрити папку . Це запустить ваш файловий менеджер. Якщо chromeпапки немає, створіть її. Після цього перейдіть до цієї chromeпапки та створіть userChrome.cssфайл, відкрийте його в текстовому редакторі та додайте: .devtools-monospace {font-size: 12px!important;} Зберегти. Обов’язково перезапустіть Firefox.

ОНОВЛЕННЯ : Одне мене турбувало - під час набору тексту в консолі devtools текст насправді трохи менше, ніж на виході (після натискання клавіші Enter). Для того, щоб зробити його однаковим, нам потрібно змінити розмір шрифту для відповідного класу css. Я ще не знаю його назви класу, тому я просто встановив

* { font-size: 12px !important; } у всьому світі, і це працює.

Можливо, простішим способом буде відкрити about:configта встановити devtools.toolbox.zoomValueбільшу цінність.

Тож впевнений, що, як уже зазначалося раніше, короткою відповіддю є cmd+ +.

Але +знак може бути недоступний безпосередньо на вашій клавіатурі (відсутність цифрової клавіатури, ноутбука, дивного розкладки).
Потім потрібно натиснути majспочатку, щоб отримати доступ до +знаку, як, наприклад, на американській розкладці клавіатури: maj+ =.
На жаль, навіть якщо ви правильно зосереджені на панелі інструментів розробника, cmd+ maj+ =збільшує шрифт панелі веб-перегляду, тоді як cmd+ -зменшує шрифт на панелі інструментів розробника.
І у вас вийде панель веб-інструментів із розміром шрифту настільки малим, що його неможливо прочитати, і ніяк не можна його збільшити.

Тоді відповідь @ Thal стане в нагоді, коли вона буде сфокусована на панелі інструментів розробника cmd+ 0скидає розмір шрифту інструмента розробника до початкового.

Якщо ви хочете відповісти на запитання, як просить @Timothy_Truckle, ось кілька з них (звичайно, зосередьтеся все на панелі інструментів розробника):

• перейдіть на американську розкладку клавіатури та натисніть cmd+=
• знайдіть розкладку клавіатури з +безпосередньо доступною, перейдіть на неї та натисніть cmd++

Це для вас, хлопці, цікаво, чому декому важко просто натиснути cmd+ +або чому комусь важко зосередитись на панелі інструментів розробника (адже вони насправді зосереджуються на панелі інструментів розробника, але результат такий, ніби вони зосереджені в Інтернеті панель перегляду).

Ви можете вказати стиль для devtools-monospaceселектора класу. Для цього відредагуйте каталог userChrome.cssвашого профілю mozilla chromeта вкажіть потрібні властивості CSS. Наприклад:

.devtools-monospace {
    font-family: "Source Code Pro",monospace !important;
    font-size: 16px !important;
}

В userChrome.cssпотреби бути в chromeпапці вашого профілю Firefox. Якщо папка не існує, створіть її. Ваші userChrome.cssтоді буде перевизначати CSS від Firefox Девих інструментів після перезапуску браузера.

Щоб знайти свій профіль в ОС Windows, введіть: Strg + R, а потім введіть:

%APPDATA%\Mozilla\Firefox\Profiles\

Деякі елементи Firefox можна стилізувати у файлі userChrome.css, який знаходиться у папці chrome вашого профілю Firefox .
Станом на 2018 р. Змініть / створіть ~ / .mozilla / firefox / [ім’я профілю] /chrome/userChrome.css чимось подібним до:

@-moz-document url-prefix("chrome://devtools/content/") {
    * { font-size: 13px !important; }
}

Потім перезапустіть Firefox.

Рішення на форумах Mozilla майже правильно: https://support.mozilla.org/en-US/questions/1198481

Використання Ctrl+ =або Cmd+ =не було для мене ідеальним, оскільки воно збільшило шрифти для всіх елементів вікна, включаючи імена вкладок.

Використання .devtools-monospace { font-size: 13px !important;}було майже нормальним, але це не вплинуло на вкладки Налагоджувач та Мережа.

Використання рішення @ bohag_bihu мало побічні ефекти для адресного рядка та деяких інших методів введення тексту.

Я випадково змінив розмір мого вікна розробника Firefox до мінімуму (навіть більше не міг його прочитати), "CMD +" (mac) не працював для мене, ну лише для головної веб-сторінки, навіть якщо консоль була сфокусована, я просто натисніть: "CMD 0", і він повернувся до звичного стану, якщо це може бути хорошою альтернативою комусь іншому;)

Як сказав Джон, спосіб збільшити розмір шрифту в devtools - використовувати ctrl / cmd +, як і на веб-сторінці. Насправді devtools - це веб-сторінка. Потрібно лише переконатися, що кадр devtools сфокусований першим.

Боюсь, що зараз неможливо лише збільшити розмір шрифту для коду.

Для деяких версій Mozilla (я тестував на Mozilla SeaMonkey, еквівалентно Mozilla Firefox 52 ESR), потрібен явно встановлений кореневий елемент.

Це буде працювати:

@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");

поки це не буде :

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");

Після встановлення @namespaceправил,

потрібно лише додати селектори та стилі:

.devtools-monospace,
.CodeMirror,
.CodeMirror pre {
    font-family: "Courier New", monospace !important;
    font-size: 10pt !important;
}

Цей працює на FF 68 Linux з userChrome.css. Я думаю, що інструменти інспектора тепер використовують змінні CSS, а саме дерево інспектора завантажується у iframe, тому жодна з налаштувань насправді не спрацювала. з .CodeMirrorкласами.

Ви можете знайти всі змінні у цьому файлі (просто скопіюйте вставку під URL у FF, щоб переглянути джерело)

resource://devtools/client/themes/variables.css

Ось userChrome.cssось що вирішило це для мене.

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

:root {
  /* Text sizes */
  --theme-code-font-size: 13px !important;
}