Crear una carpeta llamada fonts dentro de tu proyecto:
Seleccionar la fuente deseada y descargar el archivo
Descomprimir el archivo de tu fuente descargada
Para el siguiente paso se transformara la fuente descargada en archivos WOFF y WOFF2
Hacer clic en Generator
Subir el archivo de tus fuentes descargadas anteriormente haciendo clic en Upload Fonts
Clic en
Expert... y verificar que esten tildadas las opciones de
WOFF y
WOFF2
Por ultimo tildar la opcion
Agreement y hacer clic en
Download your kit
Esperar a que se descargue el archivo comprimido y descomprimir, para copiar los archivos
WOFF y WOFF2 para luego pegarlos en la carpeta fonts previamente creada en tu proyecto
Y ya finanlizando insertar en tu css la fuente descargada y transformada:
HTML:
<p>Hola Mundo!</p>
CSS:
@font-face {
font-family: 'game';
src: url('../fonts/awesome_possum_shine_demo-webfont.woff2') format('woff2'),
url('../fonts/awesome_possum_shine_demo-webfont.woff') format('woff');
}
body{
font-size: 30px;
font-family: 'game';
}
No hay comentarios:
Publicar un comentario