웹 페이지에 로컬로 설치된 'Jingnan Mai Round Body'를 사용하고 디스플레이 문제를 해결하는 방법은 무엇입니까?

웹 페이지의 로컬 글꼴 응용 프로그램 및 표시 문제 해결

웹 디자인에서는 시각 효과를 향상시키기 위해 특정 글꼴을 사용해야합니다. 이 기사는 "Jingnan Mai Round"를 예로 들어 웹 페이지에 로컬 설치된 글꼴을 적용하고 가능한 디스플레이 문제를 해결하는 방법을 설명합니다.

사용자가 시스템에 "Jingnan Mai Round"를 설치했다고 가정하지만 웹 사이트에서 글꼴을 사용할 때 표시 문제가 발생하기를 희망합니다. CSS 코드는 다음과 같습니다.

 /*@font-face {
    Font-Family : 'Myfont';
    src : url ( '/style1/font/jingnanmai round body.otf') 형식 ( 'truetype');
}*/
HTML, 바디 {font-size : 18px; font-family : "Jingnan Mai Round Body", "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, Sans-Serif;}

웹 페이지에는 "Jingnan Mai Round Body"대신 "Microsoft Yahei"가 표시됩니다. 사용자는 글꼴을 로컬로만 표시하면되며 글꼴 파일이 크기 때문에 src 속성을 통해 소개되기를 원하지 않습니다.

해결책:

열쇠는 CSS 코드를 조정하고 로컬 글꼴을 올바르게로드하고 적용하는 것입니다.

먼저, font-family 속성을 수정하십시오. 할 것이다:

 Font-Family : "Jingnan Mai Round Body", "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, Sans-Serif;

변경 :

 Font-Family : "MyFont", "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, Sans-Serif;

둘째, @font-face 규칙을 활성화하고 수정하여 "Jingnan Mai Round Body"가 올바르게로드되었는지 확인하십시오.

 @font-face {
    Font-Family : 'Myfont'; /* 상류 및 소문자에주의를 기울이십시오*/
    SRC : 로컬 ( 'Jingnan Mai Round'); /* local ()*/를 사용하여 로컬 글꼴을 선언합니다.
}

local() 함수는 브라우저에 로컬 설치된 글꼴 찾기 우선 순위를 정하라고 지시합니다. 글꼴이 로컬로 설치되지 않으면 브라우저는 폴백 글꼴 ( "Microsoft Yahei"등)을 계속 사용합니다.

마지막으로 브라우저 캐시를 지우거나 브라우저를 다시 시작하여 CSS 변경 사항이 적용됩니다. 위의 단계를 수행 한 후 웹 페이지는 로컬 테스트 환경에 "Jingnan Mai Round Body"를 성공적으로 표시해야합니다.

위 내용은 웹 페이지에 로컬로 설치된 'Jingnan Mai Round Body'를 사용하고 디스플레이 문제를 해결하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!