Firefox 개발자 도구에서 코드 글꼴 크기 늘리기

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+ +유닉스 / 승리 또는 Cmd+ +Mac에서.

분명히 말하면 +열쇠를 의미합니다 . Shift그것을 하는 동안 당신은 붙들 필요가 없습니다 .

---

Firefox를 열고 about:support. 에서 응용 프로그램 기본 사항 - 섹션은 프로파일 디렉토리 선택 오픈 디렉토리를 . 파일 관리자가 실행됩니다. chrome폴더 가없는 경우 생성합니다. 그런 다음이 chrome폴더 로 이동하여 userChrome.css파일을 만들고 텍스트 편집기에서 열고 추가 : .devtools-monospace {font-size: 12px!important;}저장합니다. Firefox를 다시 시작하십시오.

업데이트 : 한 가지가 나를 괴롭 혔습니다 . devtools 콘솔에 입력 하는 동안 텍스트는 실제로 출력보다 약간 작습니다 (Enter를 누른 후). 동일하게 만들려면 해당 CSS 클래스의 글꼴 크기도 변경해야합니다 . 아직 클래스 이름을 모르기 때문에 방금 설정했습니다.

* { font-size: 12px !important; } 전 세계적으로 작동합니다.

---

따라서 앞서 언급했듯이 짧은 대답은 cmd+ +입니다.

그러나 +기호는 키보드에서 직접 액세스 할 수 없습니다 (숫자 키패드, 노트북, 이상한 레이아웃 없음).
그런 다음 미국식 키보드 레이아웃과 같이 기호 maj에 액세스하려면 먼저 를 눌러야 +합니다. maj+ =.
불행히도 개발 도구 창에 올바르게 초점을 맞추고 있더라도 cmd+ maj+ =는 웹보기 창의 글꼴을 늘리고 cmd+ -는 개발 도구 창의 글꼴을 줄입니다.
그리고 글꼴 크기가 너무 작아서 읽을 수없고 늘릴 방법이없는 웹 도구 창으로 끝납니다.

Thal의 대답은 편리한 오는 그런 다음 @, 한 번 개발 도구 창에 초점을 맞추고 cmd+ 0원본과 리셋 개발 도구의 글꼴 크기.

If you want to answer the question like @Timothy_Truckle is asking for, here are a couple of them (still focus on the dev tool pane, of course):

• switch to the US keyboard layout and press cmd+=
• find a keyboard layout with the + directly accessible, switch to it, and press cmd++

That's for you guys wondering why some find it hard to simply press cmd++ or why some find it hard to focus on the dev tool pane (because they actually focus on the dev tool pane, but the result is as if they were focused on the web view pane).

---

You can specify a style for the devtools-monospace class selector. To do so, edit userChrome.css in your mozilla profile's chrome directory, and specify the CSS properties you want. For example:

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

The userChrome.css needs to be in the chrome folder of your Firefox profile. If the folder don't exist, create it. Your userChrome.css will then override the CSS from Firefox dev tools after you restart the browser.

To find your profile in Windows OS type: Strg + R and then enter:

%APPDATA%\Mozilla\Firefox\Profiles\

---

Some elements of Firefox can be styled in the userChrome.css file situated in your Firefox profile's chrome folder.
As of 2018, modify/create ~/.mozilla/firefox/[profile-name]/chrome/userChrome.css with something similar to:

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

Then restart Firefox.

The solution on the Mozilla forums almost has it right: https://support.mozilla.org/en-US/questions/1198481

Using Ctrl+= or Cmd+= was not ideal for me since it increased fonts for all the elements of the window, including the tab names.

Using .devtools-monospace { font-size: 13px !important;} was almost ok, but it did not affect the Debugger and Network tabs.

Using @bohag_bihu's solution had side effects for the address bar and some other text inputs.

---

As John said, the way to increase the font-size in the devtools is to use ctrl/cmd+, just like you would on a web page. In fact the devtools is a webpage. You just need to make sure that the devtools frame is focused first.

I'm afraid there's no way to only increase the font-size for the code right now.

---

실수로 파이어 폭스 개발자 창을 최소 크기로 조정했고 (더 이상 읽을 수도 없었습니다), "CMD +"(mac)는 콘솔에 초점이 맞춰져 있어도 메인 웹 페이지에서만 작동하지 않았습니다. 그냥 누르십시오 : "CMD 0"그리고 다른 사람에게 좋은 대안이 될 수 있다면 정상으로 돌아 왔습니다;)

참고 URL : https://stackoverflow.com/questions/27273389/increase-code-font-size-in-firefox-developer-tool