PUBLIC MARKS from decembre with tags font & css

Line-height and vertical-align are simple CSS properties. So simple that most of us are convinced to fully understand how they work and how to use them. But it’s not. They really are complex, maybe the hardest ones, as they have a major role in the creation of one of the less-known feature of CSS: inline formatting context.

The @font-face CSS at-rule allows you to define and use your own custom fonts, thus allowing you to extend the limited set of standard system fonts that are installed by default on a computer, and that browsers can access and use.

Iconic Font is a free set of 263+ finest icons in one font for your next project. @font-face: .im { display: inline-block; font: 24px/1 "iconmonstr-iconic-font"; text-rendering: auto; }

You should have a look at http://iconmonstr.com Iconmonstr.com has a growing collection of SVG icons which you can download and use for free

Aller un peu plus loin Oui mais voila, il reste encore trop de fichiers à charger. C'est là qu'intervient le schéma Data-URI, que l'on utilisait pour les icônes images afin de supprimer une requête en intégrant directement l'image dans le fichier CSS. L'idée est la même, intégrer directement la police de caractères dans le fichier CSS. Une option disponible dans les préférences d'Icomoon : "Encode et Embed Font in CSS". On se retrouve avec un fichier CSS contenant les définitions suivantes, où les versions TTF et WOFF de la police sont directement dans le fichier CSS, la version EOT restant externe.

Fonts with support for much of the unicode standard.

CSSFontStack is a simple, one-page website which lists all the web-safe fonts.Today, many websites are using web-fonts with @font-face for a more customized design. However, web-safe fonts usage is still so wide as many others prefer to make sure all fonts will be displayed cross-browser/device, not to use web-fonts services and/or minimize the total size of websites.

Play with Web Fonts: This is the easiest way to test or design with web fonts from WebINK. Just open FontDropper 1000 on any web page and start dropping fonts. See your changes instantly. Adjust font size, color, spacing and more