Discussion :

[crush09]

J'ai intégré une font dans un site que je suis en train de monté et ma font ne s'affiche pas( sur plusieur navigateur). j'ai testé avec une autre font et ca fonctionne,alors je ne comprend pas, est-ce qu'il y a certaine font qui ne fonctionne pas avec le @font-face?

voici mon code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
@font-face {
font-family: 'TF';
    src: url('../font/TechnicBold/technicbold-webfont.eot');
    src: url('../font/TechnicBold/technicbold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/TechnicBold/technicbold-webfont.woff') format('woff'),
         url('../font/TechnicBold/technicbold.ttf') format('truetype'),
         url('../font/technicbold-webfont.svg#webfontregular') format('svg');
 
 
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
#right-bloc {
	float:right;
	padding-top:50px;
	padding-right:62px;
	color:#fdb913;
	font-size:15px;
	font-family:'TF', Arial, Helvetica, sans-serif;
}

[miss_socrates]

Réponse basée sur 2 remarques:
1) font-face est une propriété html qui est obsolète et il vaut mieux la remplacer par du css (font-family)
2) Les polices de caractères ne s'affichent sur l'écran de l'internaute que si elles sont installées. Donc il vaut mieux utiliser des polices standards qui ont plus de chance de se trouver sur les ordinateurs de la majorité des internautes. C'est pour cela aussi qu'on indique dans font-family 3 familles de caractères dans l'espoir qu'il y en ait au moins une qui soit installée sur tous les ordinateurs.

[crush09]

Réponse basée sur 2 remarques:
1) font-face est une propriété html qui est obsolète et il vaut mieux la remplacer par du css (font-family)
2) Les polices de caractères ne s'affichent sur l'écran de l'internaute que si elles sont installées. Donc il vaut mieux utiliser des polices standards qui ont plus de chance de se trouver sur les ordinateurs de la majorité des internautes. C'est pour cela aussi qu'on indique dans font-family 3 familles de caractères dans l'espoir qu'il y en ait au moins une qui soit installée sur tous les ordinateurs.

@font-face n'est pas du tout obsolète... au contraire c'est du CSS3, ce qui permet d'affiché différente font et non seulement les font sur le système de l'utilisateur. Pour ma part habituellement ça fonctionne bien mais pas pour la font que j'ai choisi alors pour ça que je pose la question

[laffreuxthomas]

@font-face n'est pas du tout obsolète...

Exact.

Je ne vois pas d'erreur. Essayez de ne mettre que le .woff pour voir :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
@font-face {
  font-family: TF;
  src: url('../font/TechnicBold/technicbold-webfont.woff');
}

Il faut aussi vérifier que l'URL "../font/TechnicBold/technicbold-webfont.woff'" est accessible relativement à l'URL de la CSS.

[Halex78]

J'ai un problème similaire, en fait c'est seulement sous safari, une des deux polices que j'ajoute avec @font-face foire (Chantelli Antiqua), l'autre pas (1543 Humane Jenson). Avec les autres navigateurs (chrome y compris) pas de problème.