@ font-face not working css3

나는 Chrome과 Firefox에서 작동하는 @ font-face를 얻으려고하고 있지만 운이별로 없습니다.@ font-face not working css3

내가 사용하는 코드는 http://testing.teachyourselfstuff.com에서 찾을 수 있습니다 누군가가 날 지점 수 있다면 여기

main.css가 파일

@font-face { 
    font-family: FamilyName; 
    src: url('http://testing.teachyourselfstuff.com/media/3Dumb.ttf'); 
} 

.3DFont { 
    font-family: FamilyName, serif; 
}

index.html을

<!doctype html> 

<html> 

    <head> 
     <meta charset="UTF-8"> 
     <meta name="author" content="Daniel Foreman"> 
     <meta name="description" content="This is my hand coded html5 template."> 
     <meta name="generator" content="Bluefish 2.2.5" > 
     <meta name="keywords" content="basic, template, html5, css"> 

     <title>My website</title> 

     <link rel="stylesheet" type="text/css" href="css/main.css"> 
     <link rel="icon" type="image/x-icon" href="favicon.ico" > 
     <link rel="author" type="text/plain" href="humans.txt"> 
    </head> 

    <body> 

     <p class="3DFont">This is test text.</p> 


     <script src="js/plugins.js"></script> 
     <script src="js/main.js"></script> 
    </body> 

</html>

파일 나는 옳은 방향으로 감사 할 것입니다.

출처

2014-12-10 Daniel Foreman

브라우저마다 다른 글꼴 유형을 사용해야하므로 자세한 내용을 보려면 여기를 참고하십시오. http://stackoverflow.com/questions/14287465/font-face-not-loaded/14287894#14287894 – 97ldave

나는 당신의 pclass이 당신의 문제가 fonts에 classp 태그를 변경하고 내가 사이트에 그것을 시도 작동의 원인이되는 숫자로 시작하고 있기 때문에 생각

출처

2014-12-10 12:29:20 Akshay

귀하의 CSS 식별자 (3DFont) 숫자로 시작할 수 없습니다. CSS에서

(요소 이름, 클래스, 선택기의 ID를 포함한다)의 식별자는 문자 만 [A-ZA-Z0-9] 및 ISO 10646 문자 U + 00A0 이상 더하여 포함될 수 하이픈 (-)과 밑줄 (_); 숫자로, 두 개의 하이픈 또는 하이픈으로 시작하고 자릿수로 시작할 수 없습니다. 식별자에는 이스케이프 문자와 ISO 10646 문자가 숫자 코드로 포함될 수도 있습니다 (다음 항목 참조). 예를 들어, 식별자 "B & W?" "B \ & W \?"로 쓰여질 수 있습니다. 또는 "B \ 26 W \ 3F".

자세한 내용은 CSS의 사양을 확인 : http://www.w3.org/TR/CSS2/syndata.html#value-def-identifier 코드와 몇 가지 문제가 있습니다

출처

2014-12-10 12:35:47 vicente

클래스 이름은 숫자로 시작하십시오. CSS 식별자는 사용할 수 없습니다. 두 가지. –

에만 .TTF 형식을 사용하는가. 여러 브라우저에서 사용하려면 몇 가지 글꼴 형식이 필요합니다. 예 : FontSquirrel을 생성하여 관련 CSS 코드를 생성하십시오.
다른 서버의 글꼴 리소스를 참조하는 것은 일반적으로 서버가 허용하도록 설정되어 있지 않으면 실패합니다. 이것이 다른 모든 것들이 고쳐질 때에도 jsfiddles가 여기서 실패하는 이유입니다.
CSS 식별자는 (인코딩되지 않은) 숫자로 시작하면 안됩니다. 다른 클래스 이름을 (일관되게) 사용하거나 CSS 사양에 정의 된대로 숫자에 대한 이스케이프를 사용하여 피할 수 있습니다.

. \ 33 DFont { font-family : FamilyName, serif; } 고정이와

, 그것은 다운로드 글꼴로 .TTF 폰트를 지원하는 브라우저에서 작동합니다. 이것은 브라우저에서 로컬로 편집 된 CSS가있는 라이브 사이트를 사용하여 테스트되었습니다.

출처

2014-12-10 12:49:41

좋은 답변입니다.포인트 넘버 1을 따라 가려면 조금 더 자세한 정보가 필요합니다. http://stackoverflow.com/questions/15521130/google-warning-resource-interpreted-as-font-but-transferred-with-mime-type -appl/15522254 # 15522254 ;-) – 97ldave

@ font-face not working css3

답변

관련 문제