fontsquirrel como instarlas en un paso a paso
fontsquirrel como instalamos tal paquete .
Sitio de descarga
Buscamos la fuente que mas nos guste .
desde
descargamos
"Estas son la que funcionan para la web ok "
Que tenemos
1- licencia .
2-Demo.
3-instalación para windows.
*
*
*
*
después tenemos 4 archivos mas son los que se pegaran el la carpeta del proyecto
.
donde tienes las fuentes con la que estas trabajando .
*
*
*
4-eot
5-svg
6-ttf
7-woff
y por ultimo el css
stylesheet
que contiene el código mágico .
@font-face {
font-family: 'RedressedRegular';
src: url('Redressed-webfont.eot');
src: url('Redressed-webfont.eot?#iefix') format('embedded-opentype'),
url('Redressed-webfont.woff') format('woff'),
url('Redressed-webfont.ttf') format('truetype'),
url('Redressed-webfont.svg#RedressedRegular') format('svg');
font-weight: normal;
font-style: normal;
}
vamos a llevarnos estos hasta el estilo.css de nuestro proyecto .
copiamos y pegamos arriba (en primer lugar )
Por costumbre separa todo por carpetas una de estas la llame fuentes por el css del las url del código encamino con rutas relativas de esta manera .
@font-face {
font-family: 'RedressedRegular';
src: url('../fuentes/Redressed-webfont.eot');
src: url('../fuentes/Redressed-webfont.eot?#iefix') format('../embedded-opentype'),
url('../fuentes/Redressed-webfont.woff') format('woff'),
url('../fuentes/Redressed-webfont.ttf') format('truetype'),
url('../fuentes/Redressed-webfont.svg#RedressedRegular') format('svg');
font-weight: normal;
font-style: normal;
}
El nombre de la fuente es RedressedRegular puede cambiarlo por el que quiera la broma es usar el mismo despues .
otra cosa las fuentes están en formato adecuado para los distintos navegadores
EOT. Internet Explorer.
WOFF. Firefox ,Internet Explorer .
TTF. Safari .
SVG . Moviles Iphone y Ipad etc .
Listo esto solo queda aplicarlo al H1 al H2
de esta manera
header h1{
font-family: "RedressedRegular";
}
;)
Comentarios
Publicar un comentario