http://www.w3.org/Style/CSS/ |
CSS3: Fonts, @font-face i Fira Sans
Entre altres funcionalitats pel disseny de pàgines, CSS3 permet la incorporació de diverses fonts, tant des del propi servidor com importades de un altres servidor.Aquesta darrera es molt interessant per tal d'importar fonts des de servidors on estan publicades per a compartir, veiem els paràmetres i un exemple:
Exemple de codi:
@font-face
{
font-family:FiraSans, Georgia, Serif;
font-weight:900;
font-variant:small-caps;
src: url(https://github.com/buildingfirefoxos/Building-Blocks/blob/gh-pages/fonts/FiraSans/FiraSans-Regular.otf);
}
Repàs dels paràmetres principals
Paràmetre | Tractament |
---|---|
font-family | Indica la prioritat de les fonts disponibles. |
font-weight | Especifica el "pes", per exemple negreta ("bold"). Hi ha una normalització del pes per a facilitar el tractament: normal, bold, 100, 400, etc...
|
font-strech | Especifica principalment la relació entre alt i ample de la font. No esta gaire suportat encara. |
font-style | |
font-size | Especifica el tamany |
font-variant | Especifica el tractament del text. Té 2 opcions: normal: Text normal small-caps: El text es genera automàticament en "Versalita" |
Formats | Woff (Web Open Font Format): .woff TrueType: .ttf Desenvolupat per Apple als 80' OpenType: .ttf, .otf Embedded-opentype: .eot SVG Font: .svg, svgz. Típic de iOS (iPad, iPhone) |
A Webfonts.info es pot trobar una llista de llocs i plans per a descarregar embedded fonts, fontsquirrel.com i Google fonts disposen d'una àmplia llista també.
No hay comentarios:
Publicar un comentario