Polices à télécharger : @font-face

, par Christophe

Utliser une police de caractères servie depuis une URL :
la propriété CSS @font-face

  1. /*
  2.  * téléchargement des polices
  3.  */
  4. @font-face {
  5.         font-family: 'Vegur';
  6.         src: url('fonts/Vegur-Regular-webfont.woff') format('woff');
  7.         font-style: normal;
  8. }
  9. @font-face {
  10.         font-family: 'VegurBold';
  11.         url('fonts/Vegur-Bold-webfont.woff');
  12.         font-weight: bold;
  13. }
  14.  
  15. @font-face {
  16.         font-family: 'merriweather';
  17.         src: url('merriweather-bold.woff2?#iefix') format('woff2'),
  18.                  url('merriweather-bold.woff') format('woff'),
  19.                  url('merriweather-bold.ttf') format('truetype');
  20.          font-weight: bold;
  21.          font-style: normal;
  22. }
  23.  
  24. /*
  25.  * Utiliser des polices définies en @font-face
  26.  */
  27. body {
  28.         font-family: Vegur;
  29. }
  30. h1 {
  31.         font-family: merriweather, georgia, serif;
  32. }

Télécharger

Licence Creative Commons Cet article est mis à disposition selon les termes de la Licence Creative Commons Attribution - Partage dans les Mêmes Conditions - 4.0 International.

Dans la même rubrique