☰

특정 웹사이트에서만 Firefox의 글꼴을 교체하고 특정 글꼴만 교체합니다.

tag-icon • tag-icon firefox fonts
특정 웹사이트에서만 Firefox의 글꼴을 교체하고 특정 글꼴만 교체합니다.

웹사이트의 글꼴을 바꾸는 방법이 있습니까? 특정 웹사이트에서만 가능합니까? 콘텐츠 아래에 있는 옵션을 알고 있지만 이는 모든 웹사이트에 적용되며 특정 웹사이트에서만 문제가 발생하고 때로는 특정 글꼴에서만 문제가 발생하기도 합니다.

답변1

페이지 수에 따라,세련된옵션일 수도 있습니다. 글꼴을 다시 정의하는 간단한 CSS 파일을 만듭니다.

그런 다음 스타일을 적용할 URL을 선택합니다.

훌륭한 CSS 지식은 필요하지 않습니다 font-family: whatever;. .

답변2

이를 위해 사용자 스타일 시트를 생성할 수 있습니다. 사용자 스타일 시트를 사용하면 사이트의 CSS 스타일을 재정의하고 이를 자신만의 스타일로 바꿀 수 있습니다.

먼저 Firefox의 프로필 폴더를 찾아 CSS 파일을 만들어야 합니다. 다음을 수행하세요.

  • Firefox 메뉴(Firefox 창의 왼쪽 상단 모서리에 있음)를 클릭합니다.
  • 도움말 -> 문제 해결 정보를 선택하세요.
  • 응용 프로그램 기본 사항 섹션에서 프로필 폴더 줄에 있는 Show Folder또는 버튼을 클릭합니다.Edit Folder
  • 열린 폴더에서 폴더로 이동하거나 chrome(존재하지 않는 경우) 이름이 새 폴더를 만듭니다 chrome.
  • 라는 새 텍스트 파일을 만듭니다.userContent.css

이제 텍스트 편집기(예: Windows 메모장)에서 새 파일을 엽니다.

이제 CSS를 사용하여 특정 웹 사이트의 스타일을 재정의할 수 있습니다. 예를 들어 Serif 스타일을 사용하도록 이 웹 사이트의 모든 기본 글꼴을 변경하려면 다음을 사용하세요.

@-moz-document domain(superuser.com){ html, p, li, h1 {font-family : serif !important;} }

또는 StackOverflow의 모든 링크를 기울임꼴 Arial 글꼴로 변경하려면 다음을 수행하세요.

@-moz-document domain(stackoverflow.com){ a {font-family : arial !important;font-style:italic !important;} }

해당 CSS 줄을 세분화하면 다음과 같이 구성됩니다. @-moz-document domain(superuser.com)이것은 새 규칙을 적용할 웹사이트를 지정하는 줄의 일부입니다. 간단히 "superuser.com"을 변경하려는 웹사이트로 바꾸세요. html, p, li, h1해당 페이지에서 스타일을 변경하려는 HTML 요소의 목록입니다. font-family : serif !important;은 HTML에 적용할 새로운 CSS 스타일 규칙입니다. 지시어 !important는 이 파일의 CSS가 사이트 자체 스타일시트의 CSS를 재정의하도록 합니다.

따라서 usercontent.css 파일에는 다음이 포함됩니다.

@-moz-document domain(superuser.com){ html, p, li, h1 {font-family : serif !important;} }

@-moz-document domain(stackoverflow.com){ a {font-family : arial !important;font-style:italic !important;} }

이제 해당 파일을 저장하고 Firefox를 다시 시작하면 텍스트가 원하는 방식으로 스타일이 지정된 것을 볼 수 있습니다.

답변3

https://superuser.com/a/532623/460302위는 StackExchange에서 찾은 최고의 답변이지만 스타일시트의 클래스에 관한 세부 정보를 추가하고 싶습니다(https://ffathers.wordpress.com/2013/03/10/how-to-override-css-stylesheets-in-firefox):

위의 한 줄 구문 외에도 userContent.css다음과 같은 여러 줄 항목을 포함할 수 있습니다.

@-moz-document domain(jsbin.com){ 

#bin .editbox .CodeMirror pre,
.mobile .editbox textarea {
  font-family: Menlo, Monaco, consolas, monospace !important;
}
}

style.css이것은 실제로 jsbin의 "Source Code Pro" 글꼴 사용을 비활성화하는 jsbin 스타일 시트( jsbin v4.1.0 ) 중 하나의 수정된 섹션입니다 .

관련 정보