전체 HTML 문서에 전역 글꼴을 적용하는 방법


175

텍스트와 서식이 포함 된 HTML 페이지가 있습니다. 텍스트의 모든 내부 서식을 무시하고 동일한 글꼴 모음과 동일한 텍스트 크기를 만들고 싶습니다.

HTML 페이지의 전역 글꼴 형식을 설정하고 싶습니다.

어떻게하면 되나요?

답변:


263

!importantCSS 내 에서 별표와 요소 를 활용할 수 있어야합니다 .

html *
{
   font-size: 1em !important;
   color: #000 !important;
   font-family: Arial !important;
}

별표는 모든 것과 일치합니다 (아마도 도망 갈 수 있습니다 html).

!important보장 아무것도 당신이 스타일로 설정 한 것을 무시할 수 없다 (그것은 또한 중요하지 않은 경우). (이것은 "텍스트의 내부 서식을 무시"해야한다는 요구 사항을 돕기위한 것입니다. 다른 스타일에서는이를 덮어 쓸 수 없음을 의미했습니다)

괄호 안의 나머지 스타일은 다른 스타일과 동일하며 원하는 스타일로 할 수 있습니다. 예를 들어 글꼴 크기, 색상 및 가족을 변경하기로 선택했습니다.


24
+1 !important은 유용하지만 과도하게 사용되면 "몬스터 일 것"이 될 수 있습니다.
StuperUser

2
의 좋은 사용을 제공하는 일 !important. 항상 마지막 옵션으로 사용해야합니다.
dShringi

3
!important여기서 사용 하는 것은 원래 포스터의 요구 사항 때문입니다. "텍스트의 모든 내부 서식을 무시하고 동일한 글꼴 군과 동일한 텍스트 크기를가집니다." 해당 요구 사항이 없으면를 사용하고 싶지 않습니다 !important.
세스

1
의 사용 html * {}또는 body * {}좀 더 구체적 통해 재정의를 방지하는 데 도움이 될 것입니다 body p {}포함 된 스타일 시트입니다. body p {}보다 구체적 body {}이므로 별표가 여기서 중요한 요소입니다.
YoYo

1
나는 당신이 생략 할 수 있습니다 생각 html에서 html *여기에
JonnyRaa

44

가장 좋은 방법은 글꼴을 본문으로 설정하는 것입니다.

body {
    font: normal 10px Verdana, Arial, sans-serif;
}

일부 요소에 대해 변경하기로 결정하면 쉽게 덮어 쓸 수 있습니다.

h2, h3 {
    font-size: 14px;
}

Foundation CSS와 같은 프레임 워크를 사용하는 경우! important를 추가하지 않으면 작동하지 않습니다.
Petros Kyriakou

16

CSS의 바디 선택기에서 설정하십시오. 예 :

body {
    font: 16px Arial, sans-serif;
}

1
보다 구체적인 선택기로 재정의 할 수 있습니다.
StuperUser

2
그것은 예를 들어, 모든 요소에 적용되지 않는다 : 입력 유형 = '버튼'
RRTW

12

다음 CSS를 사용하십시오.

* {
    font: Verdana, Arial, 'sans-serif' !important;/* <-- fonts */
}

*-selector 의미 있는 / 모든 요소를하지만, 더 많은 재정에 관해서 분명히 먹이 사슬의 맨 아래에있을 것입니다 특정 선택기.

텍스트를 설정하는 데 다른 선택기 (예 : 또는 a ) 를 사용해도 !important-flag는 font스타일을 *절대적으로 렌더링합니다 .bodyp


1
어쩌면 !important설정을 무시에서 다른 선택기를 방지합니다.
Quasdunk

1
예, !important다른 셀렉터가 사용하지 않는 한 다른 셀렉터가 재정의하는 것을 방지합니다. 허. 게시물을 수정하고 추가하겠습니다. 감사합니다. :-)
karllindmark

그렇습니다. 확실하지 않지만 선호도 선언 위치에 달려 있다고 생각합니다. 맨 아래에 배치하면 위 !important의 더 구체적인 선택기에서 s를 무시할 수도 있습니다 . 그러나 그것은 내가 여기서 생각하는 요점은 아니다 :)
Quasdunk

이것은 실제로 나를 위해 일한 유일한 대답입니다. 이유는 확실하지 않지만 그랬습니다.
피터 고든

5

를 사용해서는 안됩니다 * + !important. HTML 문서의 일부에서 글꼴을 변경하려면 어떻게해야합니까? 당신은 항상 중요하지 않고 몸을 사용해야합니다. !important다른 옵션이없는 경우에만 사용하십시오 .


1

이 시도:

body
{
    font-family:your font;
    font-size:your value;
    font-weight:your value;
}

안녕 앵글 리 매스, 나는 당신의 코드를 포맷했다. 당신이 4 개의 공백이나 {}버튼을 사용하면 대답에 예제 코드를 이런 식으로 표시 할 수있다.
StuperUser
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.