Увеличение размера шрифта кода в firefox developer tool

Как изменить шрифт в Firefox

Учеными доказано, что от характера отображения информации на дисплее зависит ее востребованность и усвоение. Поэтому так важно подобрать оптимальный вариант, устраивающий не только пользователя, но и его высшую нервную систему. Сегодня мы поговорим о том, как изменить шрифт в Мозиле Фаерфокс, также поговорим о цветовой коррекции текста и других параметрах.

Подведем итоги

Настройка шрифта и цвета текста – простая задача, не требующая существенных временных затрат. Процедура занимает считанные минуты и окупается сторицей.

Источник

Увеличить интерфейс (вкладки, меню)

Чтобы не ломать глаза, системные меню и шрифты в браузере сделаем крупнее с помощью дополнения:

После установки его можно найти в Меню › Инструменты. Мои настройки: шрифт Segoe UI (оптимален для интерфейса), размер 19 пикселей (если установить больше, иконки и названия сайтов на вкладках «разъезжаются»).

Изменение масштаба страницы в Firefox

Многие люди большую часть своего рабочего времени проводят за компьютером, и мы часто забываем, что при длительной работе за монитором в самую первую очередь основную нагрузку получают глаза. Специалисты утверждают, что оптимальное расстояние глаз от монитора находится в пределах от тридцати до пятидесяти пяти сантиметров, при этом ни в коем случае нельзя щуриться. Если при заданном расстоянии вам плохо виден текст интернет — ресурсов или к концу дня вы плохо стали его разбирать, то лучше увеличить масштаб страницы или сам текст, а не «тыкаться носом» в экран монитора. Как это сделать мы разберем ниже.

change-masshtab-page-v-firefox-2-300x200.jpg

Экраны с высоким DPI

Для таких экранов рецепт тот же, только нужно подобрать подходящие цифры. При вёрстке сайтов подойдёт, например, масштаб 2:1 — чтобы чётко понимать, что происходит с размерами блоков.

Увеличение и уменьшение масштаба веб-сайта

Вот как вы можете увеличивать и уменьшать масштаб отдельных веб-сайтов.

  1. Щёлкните по кнопке меню 2014-01-10-13-08-08-f52b8c.pngс правой стороны. Откроется меню настройки и на самом верху вы увидите управление масштабом. 2017-10-22-23-58-51-adde5b.png
  2. Используйте кнопку + для увеличения масштаба и кнопку — для его уменьшения. Число в середине отражает текущий уровень масштабирования — щёлкните по нему, чтобы сбросить масштаб на 100%. Вы также можете видеть текущий уровень масштабирования в адресной строке:

2017-10-24-09-18-39-4b21e9.png

Размер шрифта и масштаб страниц — увеличьте размер веб-страниц

Управление масштабом позволяют увеличить или уменьшить либо размер целой веб-страницы либо просто размер всего текста в целях улучшения читабельности. Мы объясним, как это работает.

Другие параметры для Цвета

Текст и фон: Здесь вы можете изменить цвет текста и фона по умолчанию для использования на веб-страницах, которые не указали эту информацию. Щёлкните по образцу цвета для выбора цвета из палитры.

  • Использовать системные цвета: Проверьте этот параметрпараметр, чтобы использовать цвета, определенные в настройках операционной системы вместо цветов, указанных выше.

Цвет ссылок: Здесь вы можете изменить цвета по умолчанию для веб-ссылок. Щёлкните по образцу цвета для выбора цвета из палитры.

  • Подчёркивать ссылки: По умолчанию, ссылки подчеркнуты на веб-страницах. Снимите этот флажокфлажок, чтобы отключить это. Обратите внимание, что многие сайты определяют свои собственные правила стиля и этот параметрпараметр не будет иметь никакого эффекта на этих сайтах.
  • Заменять цвета, указанные страницей на выбранные выше цвета:
    • Всегда: Выберите этот параметрпараметр, чтобы заставить все сайты, использовать цвета по умолчанию.
    • Только с контрастными темами: Этот параметрпараметр заставит Firefox использовать цвета, указанные автором веб-страницы, кроме случаев, когда вы используете Высококонтрасные Темы WindowsLinux.
    • Никогда: Выберите этот параметрпараметр, чтобы Firefox использовал цвета, указанные автором веб-страницы.

Примечание: Если позже вы захотите восстановить цвета по умолчанию:

  1. В адресной строке наберите about:config и нажмите EnterReturn.

    • Может появиться страница предупреждения about:config «Будьте осторожны, а то лишитесь гарантии!». Щёлкните по Я принимаю на себя риск!, чтобы перейти на страницу about:config.
  2. Наберите browser*color в строке Поиска.
  3. Щёлкните правой кнопкой мышиУдерживая клавишу Control, щёлкните мышью. по установленным пользователемизменённым параметрам.
  4. Выберите Сбросить.

Firefox также включает в себя функцию масштабирования. Это позволяет увеличить размер текста на любой веб-странице. Дополнительные инструкции приведены в статье

Многие люди большую часть своего рабочего времени проводят за компьютером, и мы часто забываем, что при длительной работе за монитором в самую первую очередь основную нагрузку получают глаза. Специалисты утверждают, что оптимальное расстояние глаз от монитора находится в пределах от тридцати до пятидесяти пяти сантиметров, при этом ни в коем случае нельзя щуриться. Если при заданном расстоянии вам плохо виден текст интернет — ресурсов или к концу дня вы плохо стали его разбирать, то лучше увеличить масштаб страницы или сам текст, а не «тыкаться носом» в экран монитора. Как это сделать мы разберем ниже.

Нестандартный цвет шрифта

Некоторые веб-сайты используют нестандартные цвета шрифтов. Чтобы их отключить:

Другие параметры для Цвета

Текст и фон: Здесь вы можете изменить цвет текста и фона по умолчанию для использования на веб-страницах, которые не указали эту информацию. Щёлкните по образцу цвета для выбора цвета из палитры.

  • Использовать системные цвета: Проверьте этот параметрпараметр, чтобы использовать цвета, определенные в настройках операционной системы вместо цветов, указанных выше.

Цвет ссылок: Здесь вы можете изменить цвета по умолчанию для веб-ссылок. Щёлкните по образцу цвета для выбора цвета из палитры.

  • Подчёркивать ссылки: По умолчанию, ссылки подчеркнуты на веб-страницах. Снимите этот флажокфлажок, чтобы отключить это. Обратите внимание, что многие сайты определяют свои собственные правила стиля и этот параметрпараметр не будет иметь никакого эффекта на этих сайтах.
  • Заменять цвета, указанные страницей на выбранные выше цвета:
    • Всегда: Выберите этот параметрпараметр, чтобы заставить все сайты, использовать цвета по умолчанию.
    • Только с контрастными темами: Этот параметрпараметр заставит Firefox использовать цвета, указанные автором веб-страницы, кроме случаев, когда вы используете Высококонтрасные Темы WindowsLinux.
    • Никогда: Выберите этот параметрпараметр, чтобы Firefox использовал цвета, указанные автором веб-страницы.

Примечание: Если позже вы захотите восстановить цвета по умолчанию:

  1. В адресной строке наберите about:config и нажмите EnterReturn.

    • Может появиться страница предупреждения about:config «Будьте осторожны, а то лишитесь гарантии!». Щёлкните по Я принимаю на себя риск!, чтобы перейти на страницу about:config.
  2. Наберите browser*color в строке Поиска.
  3. Щёлкните правой кнопкой мышиУдерживая клавишу Control, щёлкните мышью. по установленным пользователемизменённым параметрам.
  4. Выберите Сбросить.

Firefox также включает в себя функцию масштабирования. Это позволяет увеличить размер текста на любой веб-странице. Дополнительные инструкции приведены в статье

9 ответов

Вам необходимо изменить userChrome.css под ~/.mozilla/firefox//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-инспектора. Не уверен, что это такое.

Откройте Firefox и введите about:support . В разделе » Основы применения » выбрал «Profile Directory — Open Directory». Это уволит ваш файловый менеджер. Если папка chrome отсутствует, создайте ее. После этого перейдите в эту папку chrome и создайте файл userChrome.css , откройте его в текстовом редакторе и добавьте: .devtools-monospace {font-size: 12px!important;} Сохранить. Обязательно перезапустите Firefox.

ОБНОВЛЕНИЕ: меня беспокоило одно — при наборе в консоли devtools текст на самом деле немного меньше, чем при выводе (после нажатия Enter). Чтобы сделать его таким же, нам нужно изменить размер шрифта для соответствующего класса CSS. Я еще не знаю его название класса, поэтому я просто установил

* { font-size: 12px !important; } * { font-size: 12px !important; } глобально, и это работает.

Так что, как было сказано выше, короткий ответ — cmd + + .

Но знак + может быть недоступен непосредственно на вашей клавиатуре (без цифровой клавиатуры, ноутбука, странного макета).
Затем вам нужно нажать maj сначала, чтобы получить доступ к значку + , например, на раскладке американской клавиатуры: maj + = .
К сожалению, даже если вы правильно сфокусированы на панели инструментов dev, cmd + maj + = увеличивает шрифт панели просмотра, а cmd + — уменьшает шрифт на панели инструментов dev,
И вы получаете панель инструментов для веб-приложений с небольшим размером шрифта, который не читается, и не имеет возможности увеличить его.

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

Если вы хотите ответить на вопрос, например, @Timothy_Truckle, вот несколько из них (по-прежнему сосредоточиться на панели инструментов dev, конечно):

  • переключитесь на раскладку клавиатуры США и нажмите cmd + =
  • найдите раскладку клавиатуры с доступным + , переключитесь на нее и нажмите cmd + +

Для вас, ребята, интересно, почему некоторым трудно просто нажать cmd + + или почему некоторым трудно сосредоточиться на панели инструментов dev (потому что они фактически фокусируются на панели инструментов dev, но результат такой, как если бы они были сосредоточены на панели просмотра веб-страниц).

Вы можете указать стиль для селектора классов devtools-monospace . Для этого отредактируйте userChrome.css в своем каталоге mozilla profile chrome и укажите необходимые свойства CSS. Например:

Devtools-monospace { font-family: «Source Code Pro»,monospace !important; font-size: 16px !important;}

userChrome.css должен находиться в папке chrome вашего профиля Firefox. Если папка не существует, создайте ее. Затем ваш userChrome.css переопределит CSS из инструментов Firefox dev после перезапуска браузера.

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

%APPDATA%MozillaFirefoxProfiles

Некоторые элементы Firefox могут быть написаны в файле userChrome.css, расположенном в папке Chrome 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;} было почти нормально, но это не повлияло на вкладки Debugger и Network.

Использование решения @bohag_bihu имело побочные эффекты для адресной строки и некоторых других текстовых входов.

Как сказал Джон, способ увеличить размер шрифта в devtools — использовать ctrl/cmd +, как и на веб-странице. Фактически devtools — это веб-страница. Вам просто нужно убедиться, что рамка devtools сфокусирована в первую очередь.

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

Уже давно стал основной программой для рядового пользователя. Сейчас браузер используют не только для просмотра веб-страниц, но и для отправки почты, редактирования документов, чтения книг и т.д.

В такой ситуации не редко возникает необходимость увеличить шрифт в браузере. Ведь долго работать с мелким текстом довольно утомительно. В этом материале мы расскажем о том, как увеличить шрифт в браузере Google Chrome, Mozilla Firefox, Opera, Internet Explorer и других.

Для уменьшения или увеличения шрифта в браузере лучше всего использовать клавиатуру. Существуют такие комбинации клавиш, которые работают в , Mozilla Firefox, Opera и Internet Explorer.

CTRL и клавиша «+» – зажав клавиши CTRL и «+» на вы увеличите шрифт в браузере. При этом пользователь может использовать клавишу «+» как на основной, так и на дополнительной (Num) клавиатуре.

CTRL и клавиша «-» – использовав комбинацию клавиш CTRL и «-» вы уменьшите шрифт в браузере. Пользователь может использовать клавишу «-» как на основной, так и на дополнительной клавиатуре.

030514_0948_2.png

CTRL и колесико мышки– вы можете зажать клавишу CTRL и двигать колесиком мышки. Таким образом, вы сможете быстро уменьшить или увеличить шрифт браузера до нужной вам величины.

CTRL и клавиша «0» – данная комбинация клавиш используется для сброса масштаба увеличения страницы в браузере. Использовав данную комбинацию вы вернетесь к оригинальному размеру шрифта в браузере. Пользователь может использовать клавишу «0» (ноль) как на основной, так и на дополнительной клавиатуре. Данная комбинация клавиш работает во всех популярных браузерах (Google Chrome, Mozilla Firefox, Opera) кроме .

030514_0948_3.png

Стандартный способ

Кроме того, Mozilla предлагает увеличить текст с помощью стандартного способа, который заключается в использовании основных настроек. Для этого необходимо перейти в правый верхний угол браузера и щелкнуть по трем полоскам, которые откроют основное меню. Затем переходим в пункт «Настройки» и выбираем панель «Содержимое».

После этого стоит воспользоваться кнопкой «Дополнительно» в секции «Шрифт и Цвета». После этого перед вами выпадет меню, где отображены основные настройки текста. Там можно поменять стиль и размер текста, что собственно нам и нужно. Это позволит увеличить основной текст и добиться поставленной цели. Поэтому теперь вы обладаете необходимыми навыками для решения проблемы.

Только текст

Чтобы картинки и элементы интерфейса на сайтах не размазывались, в Фаерфоксе я первым делом ставлю галочку «Только текст»:

Меню › Вид › Масштаб › Только текст

(если меню спряталось, его можно вернуть клавишей ALT)

Теперь любые изменения масштаба коснутся только размера шрифта, а графика сайта останется чёткой. Современные сайты обладают запасом резиновости, чтобы при увеличении шрифта «ничего не поехало».

Другие способы увеличения шрифта в браузере

Также вы можете увеличить шрифт с помощью меню браузера.

В браузере Google Chromeэто можно сделать в основном меню программы. Для этого достаточно открыть основное меню (кнопка в правом верхнем углу программы) и нажать на кнопку «+», если вы хотите увеличить шрифт, или на кнопку «-», если вы хотите уменьшить шрифт.

030514_0948_4.png

В браузере Opera шрифт увеличивается и уменьшается аналогичным способом. Откройте меню программы (кнопка «Opera» в верхнем левом углу) и используйте кнопки «+» и «-».

030514_0948_5.png

В браузере Mozilla Firefox для того чтобы уменьшить или увеличить шрифт необходимо нажать на кнопку ALT на клавиатуре и после того как появится меню, открыть «Вид – Масштаб». Здесь можно будет увеличить, уменьшить или сбросить размер шрифта.

030514_0948_6.png

В браузере Internet Explorer для того чтобы уменьшить или увеличить шрифт нужно открыть основное меню программы (кнопка в правом верхнем углу программы) и выбрать пункт «Масштаб».

030514_0948_7.png

Также в Internet Explorer можно нажать на клавишу ALT и в появившемся меню открыть «Вид – Масштаб».

Mozilla Firefox

В Mozilla имеется возможность увеличить шрифт, как собственно и в любом другом браузере. Но стоит ли этим пользоваться? Безусловно, так как в шрифт порой попадается мелкий, особенно на сайтах законодательств или учреждений, которые предоставляют услуги. Чтобы внимательно ознакомиться с полускрытой информацией, вам предстоит такая процедура.

К счастью, она не занимает много времени и любой рядовой пользователь с легкостью сможет использовать доступные средства для получения нужного эффекта. Поэтому мы рекомендуем нашу инструкцию, которая позволит увеличить шрифт в Мозиле и с удовольствием читать сокрытый текст на сайте.

Благодарность автору сайта

Если Вы хотите поддержать проект, воспользуйтесь платформой Яндекс.Деньги — это конфиденциально и безопасно.

Рейтинг
( 1 оценка, среднее 5 из 5 )
Загрузка ...