Plusieurs polices en CSS

Question

Comment puis-je utiliser plus d'un type de @ font-face dans mon CSS.

J'ai inséré ceci dans ma feuille de style:

 body {
background: #fff url(../images/body-bg-corporate.gif) repeat-x;
padding-bottom: 10px;
font-family: 'GestaRegular', Arial, Helvetica, sans-serif;}

@font-face {
    font-family: 'GestaReFogular';
    src: url('gestareg-webfont.eot');
    src: local(''), url('gestareg-webfont.woff') format('woff'), url('gestareg-webfont.ttf') format('truetype'), url('gestareg-webfont.svg#webfontg8dbVmxj') format('svg');}
 

Actuellement, cela ne s'applique qu'à l'intégralité du corps du texte sur le site, mais je voudrais spécifier h1 pour utiliser une police de police différente.

Comment puis-je faire ceci? Merci

Answer 1

Remarque, vous pouvez également être intéressé par:

Web personnalisé police ne travaille pas dans IE9

Qui comprend un descriptif de la panne de la CSS que vous voyez ci-dessous (et explique les réglages qu'il fonctionne mieux sur IE6-9).

---

@font-face {
  font-family: 'Bumble Bee';
  src: url('bumblebee-webfont.eot');
  src: local(''), 
       url('bumblebee-webfont.woff') format('woff'), 
       url('bumblebee-webfont.ttf') format('truetype'), 
       url('bumblebee-webfont.svg#webfontg8dbVmxj') format('svg');
}

@font-face {
  font-family: 'GestaReFogular';
  src: url('gestareg-webfont.eot');
  src: local(''), 
       url('gestareg-webfont.woff') format('woff'), 
       url('gestareg-webfont.ttf') format('truetype'), 
       url('gestareg-webfont.svg#webfontg8dbVmxj') format('svg');
}

body {
  background: #fff url(../images/body-bg-corporate.gif) repeat-x;
  padding-bottom: 10px;
  font-family: 'GestaRegular', Arial, Helvetica, sans-serif;
}

h1 {
  font-family: "Bumble Bee", "Times New Roman", Georgia, Serif;
}

Remarque je ne sais pas quel est le nom de votre Bourdon de police ou le fichier, afin d'ajuster en conséquence, et que la police face déclaration doit précéder (venir avant) votre utilisation de l'informatique, comme je l'ai ci-dessus.