Funcionamiento de la regla @font-face en CSS

Estoy intentando usar la regla @font-face colocando esta en la hoja de estilos.css así:

@font-face{ font-family:"AEBL"; src:url("fonts/AEBL.TTF") ;}
@font-face{ font-family:"AEM"; src:url("fonts/AEM.TTF");}

div#tit h1{ font-family:"AEM";font-size:21px;color:#453F32; margin-top:20px; margin-left:52px; padding:0; letter-spacing:0.35px; }

He colocado la tipografía en una carpeta llamada fonts junto con todos los archivos de la página como lo indico en la url de la regla @font-face. Pese a todo no consigo ver esta tipografía cuando veo la página en en el explorador no aparece esta tipografía.

Nota: el Explorador esta actualizado. Tengo entendido que todos los exploradores actuales admiten esta regla con la fuente ttf sin necesidad de incluirla en otro formato.

Respuesta

The @font-face rule in CSS allows you to load custom fonts on a webpage. You define it by specifying the font's name and providing the URL of the font file. For example:

css
Copy code
@font-face { font-family: 'MyCustomFont'; src: url('myfont. Woff2') format('woff2'), url('myfont. Woff') format('woff'); }

Once defined, you can use the custom font in your CSS by referencing its name in the font-family property. This enables consistent typography across browsers, regardless of whether the user has the font installed locally.

1 respuesta más de otro experto

Respuesta
1

Acabo de hacer las pruebas con tu código y me funciona correctamente.

Unicamente se me ocurre que no tengas bien estructurado el árbol de carpetas.

Mira en chrome si te da un error tipo "404 not found" en el inspector de elementos.

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas