@ font-face no funciona en cromo

Question

Estoy usando la última versión de google chrome y no mostrará la fuente en absoluto.

Estoy ejecutando Debian Linux, y todos los demás navegadores, incluido Chromium, muestran las fuentes incluidas correctamente.

declaración Tipo de fuente que estoy usando es:

@font-face { 
    font-family: Dejaweb; 
    src: url('DejaWeb.ttf'); 
} 

@font-face { 
    font-weight: bold; 
    font-family: Dejaweb; 
    src: url('DejaWeb-Bold.ttf'); 
} 

Answer 1

probar este

src:url('DejaWeb-Bold.ttf') format('truetype'), 

Además, si las fuentes están disponibles en otro formato diferente de donde los obtuvo entonces sugiero escribir toda la Navegador cruzado compatible de la siguiente manera

@font-face { 
    font-family: "Dejaweb"; 
    src: url("DejaWeb-Bol.eot") format('embedded-opentype'), /* EDIT correction on this line */ 
    url('DejaWeb-Bol.woff') format('woff'), 
    url('DejaWeb-Bol.ttf') format('truetype'), 
    url('DejaWeb-Bolsvg#') format('svg'); 
    font-weight:bold; 
    font-style:normal; 
    } 

Answer 2

Si coloca los archivos de fuente en un carpeta llamada "fuentes" y los archivos CSS en la carpeta llamada "estilo", entonces se deben escribir la url como esta

@font-face { 
font-weight: bold; 
font-family: Dejaweb; 
src: url('../fonts/DejaWeb-Bold.ttf'); } 

acabo corregido el mismo error como este.

Answer 3

Siempre que @ font-face inexplicablemente no funciona para mí en los navegadores supuestamente compatibles, lo dejo en mi archivo .htaccess. Supuestamente, algunos navegadores no cargarán las fuentes alojadas en otros dominios, y este pequeño código lo soluciona, pero a veces es el único remedio para forzar la carga de las fuentes alojadas en el mismo dominio. En general, es más un problema con Firefox que con Chrome, pero acabo de usar esto para forzar las fuentes en Chrome mientras Firefox funcionaba bien. Imagínate.

<FilesMatch "\.(ttf|otf|eot)$"> 
<IfModule mod_headers.c> 
Header set Access-Control-Allow-Origin "*" 
</IfModule> 
</FilesMatch> 

Otra cosa inexplicablemente extraña que he tenido sucede con la sintaxis @ font-face era que no iba a cargar los archivos de fuentes correctamente con los casquillos en el nombre. Esto solo fue un problema una vez, y después de repetidamente golpear mi cabeza contra el escritorio resolviendo problemas de @ font-face de diferentes maneras, como último recurso cambié todos los archivos de fuente y el nombre de la fuente a minúsculas, y funcionó bien (Creo que fue un problema en IE siempre meticuloso, y solo un sitio web que estaba haciendo, la misma sintaxis en otro sitio web funcionaba bien con caracteres en mayúscula y minúscula).

Answer 4

@font-face {  
font-family: 'FONT-NAME'; 
src: url('RELATIVE-FONT-URL') format('FONT-FORMAT'); 
} 

div { 
    font-family: 'FONT-NAME'; 
    font-weight: normal; 
    font-style: normal; 
} 

Agregando el font-weight y font-style con el valor normal trabajado para mí.