iOS 용 Chrome에 Google 웹 글꼴이로드되지 않습니다.

Google 웹 글꼴을 사용하면 Chrome/iOS를 제외한 모든 브라우저에서 정상적으로로드됩니다. iOS 용 Chrome 및 Mac 용 Safari에서 정상적으로 작동하므로 이상하게 보입니다. 따라서 iOS 또는 Google 크롬 문제라고 생각하지 않습니다. Chrome/iOS에만 해당되는 것으로 보입니다.iOS 용 Chrome에 Google 웹 글꼴이로드되지 않습니다.

문제를 해결하는 방법에 대한 아이디어 나 아이디어가 있으면 도움이 될 것입니다.

감사합니다.

편집

나는 다음으로, 구글에서 호스팅 Google 웹 글꼴을 사용하고 있습니다 :

h1 
    font-family: "Leckerli One", cursive

: 내 글꼴 (SASS)에서

<link href="http://fonts.googleapis.com/css?family=Leckerli+One" rel="stylesheet" type="text/css" />

, 나는 다음을 사용하고 있습니다

출처

2012-12-09 andrewpthorp

- 같은 원격 Google에서 호스팅을, 또는 자신의 서버에? (이것은 종종 차이를 만듭니다.) 어떤 글꼴입니까? 사용중인 정확한 코드는 무엇입니까? –

글꼴을 다운로드하고 직접 호스팅하고 표시되는지 확인해 보셨습니까? 큰 가치가있다. –

Andrew- 사이트에 대한 링크가 있습니까? 현재 내 사이트에서 Google 웹 글꼴을 사용하고 있으며 iOS의 Chrome에서 작동합니다. 그 폰트로 테스트 해봤는데 작동하는 것으로 보인다. http://www.djfarrelly.com/test/ – djfarrelly

저도 같은 문제를보고 있어요. 내 자신의 서버에서 폰트 파일을 호스팅하고 @ font-face 규칙을 다시 작성하여 내 로컬 서버와 prod 모두에서이 문제를 해결했습니다.

원인을 알 수 없습니다. 내 최고의 추측은 UIWebViews (App Store 규칙으로 인해 UIWebView 인 iOS Chrome)에서 다르게 적용되는 동일한 출처 문제 일 것입니다.

출처

2012-12-18 14:39:58 Dave

대답은 정말로 질문에 답해야합니다. 만약 당신이 뭔가를 말하고 싶다면, 제발 (당신이 50의 평판을 가지고 있다면 이것을 할 수 있습니다) –

나는이 문제를 해결하고 그의 원래 질문에 대답했습니다. 만약 내가 그의 깊은 이론에 대한 답변을하지 않았다면, 나는 현상금을받지 못할 것이고, 모든 것이 세상에있을 것입니다. – Dave

!important

예 :

@font-face { 
    font-family: 'Monda' !important; 
    font-style: normal !important; 
    font-weight: 400 !important; 
    src: local('Monda Regular'), local('Monda-Regular'), url(http://themes.googleusercontent.com/static/fonts/monda/v1/sk05J8GA1NvUxDnk43EgAQ.woff) format('woff') !important; 
}

출처

2012-12-09 22:46:36 Enve

정답은 답이 전혀 이해가 안되기 때문입니다. – Marko

그는 여기서 CSS 인스턴스가 스타일 시트 (CSS : CSS-Cascading Style Sheet)에 더 이상 쓰여지지 않도록 제안하고 있으므로! important를 사용하여이를 재정의해야 할 수도 있습니다. 그러나 나는 이것이 당신의 문제라고 생각하지 않습니다. –

IOS 장치는 TTF 형식 (또는 아래의 개발자 지침을 따르는 경우 OTF) 만 사용합니다. 해당 글꼴은 WOFF, EOT 및 OTF (지침을 따르지 않는 것으로 가정)로 제공됩니다. 다른 버전을 제공하는 일부 services이 있습니다. @ font-face를 사용하여 글꼴을 지정하고 문제가 해결되는지 확인하십시오! Fontsquirrel은 무거운 짐을 수행 할 @font-face generator 있습니다.

후속 질문에 관해서. TrueType 글꼴 구현에 대한 Apple의 일부 개발자 문서가 있습니다. 그것은 here 찾을 수 있습니다. 기본적으로 TTF 형식은 글꼴을 sfnt 자원으로 저장합니다. 이것을 할 수있는 유일한 다른 글꼴 형식은 OpenType의 오프셋 테이블 sfnt 래퍼입니다. IOS는 sfnt 래퍼를 사용하여 글꼴을 읽으므로이 방법으로 저장되지 않은 글꼴 문제가 발생합니다. (모든 jargonny 이야기에 대해 유감스럽게 생각합니다).

출처

2012-12-19 17:38:20

내 경험이 아님 : iOS6에서 적어도 WOFF 글꼴이 제대로 작동했습니다 (Safari 및 Chrome에서 자체 서버에서 제공 한 후). 이 질문에 대한 내 대답을보십시오. – Dave

Google Fonts API Loader을 사용하면 사용자 브라우저를 감지하고 적절히 형식이 지정된 CSS를 다시 보낼 수 있습니다.

샘플 코드는 this Stack Overflow question의 첫 번째 응답에서 사용할 수 있습니다.

이렇게하면 Safari와 Chrome (및 기타 UIWebView 기반 브라우저)에서 글꼴을 올바르게 표시 할 수 있습니다.

참고 : 글꼴을 로컬로 저장하려면 @Dave가 제안한대로 this CSS이 작동해야합니다.

출처

2012-12-21 02:12:52

다른 사람 (iOS 9 이상에서 Chrome에로드되지 않는 글꼴)에서 여전히이 문제가 보이는 경우 글꼴을 js 파일이 아닌 css 파일로 가져 오기했는지 다시 확인하십시오. 글꼴.com은 js로 글꼴을 가져올 수있는 옵션을 제공합니다. js는 Chrome/iOS 9 이하에서 선택되지 않습니다. 내 수입을 css로 변경하면이 문제가 해결되었습니다. 나 작품에 대한

출처

2016-12-01 19:51:38 mixophrygian

는 PHP 페이지에 추가

어떻게 구글 웹 폰트 사용

<style type="text/css"> 
@import url('https://fonts.googleapis.com/css?family=Trocchi'); 
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i'); 
</style>

출처

2017-05-13 21:27:32 Max

iOS 용 Chrome에 Google 웹 글꼴이로드되지 않습니다.

답변

관련 문제