Problème font-family

Résolu
Grafiteur -  
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

voilà mon code : 

<style type="text/css">
.phrase {
    font-family:monotoon_kk, sans-serif; 
    src:url('fonts/monotoon_kk.ttf')format("truetype"); 
} </style>
<span class="phrase">ici la phrase</span>

mon arborescence : 


mon dossier
    index.html
    style.cssr
    fonts
        monotoon_kk.ttf


je suis sous iceweasel 38.2.1 / debian 8.1
et ma phare "ici la phrase" ne veut pas se mettre en fonte que je lui ai demandé
c'est à dire monotoon_kk, j'ai essayé de passer par @font-face directement dans style.css mais rien n'y fait et je ne vois pas le problème, j'ai besoin d'une aide extérieur la réponse doit être sous mes yeux...


A voir également:

1 réponse

Réponse 1 / 1
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   738
 
Salut
1) il faut passer par @font-face
2) il ne faut pas se tromper dans le chemin vers le font c'est souvent une erreur faite
3) il faut que ta font soit sous plusieurs formats

voici un exemple 

@font-face {
    font-family: "titre1";
    src: url(../fonts/idolwild-webfont.eot);
    src: url(../fonts/idolwild-webfont.eot?#iefix) format('embedded-opentype'),
        url(../fonts/idolwild-webfont.woff2) format('woff2'),
        url(../fonts/idolwild-webfont.woff) format('woff'),
        url(../fonts/idolwild-webfont.ttf) format('truetype'),
        url(../fonts/idolwild-webfont.svg#idolwildregular) format('svg');
}

.phrase {
font-family: 'titre1', Georgia, Times New Roman, Times, serif;
}


pour créer les formats de font d'après un ttf tu peux aller sur le site fontsquirrel.com (generator)
1
Grafiteur
 
j'arrive donc à ce résultat : 

style.css

@font-face {
 font-family: monotoon;
 src:
 url('../fonts/monotoon_kk.eot?#iefix') format('embedded-opentype')
 url('../fonts/monotoon_kk.ttf') format('truetype')
 url('../fonts/monotoon_kk.woff') format('woff')
 url('../fonts/monotoon_kk.woff2') format('woff2')
 url('../fonts/monotoon_kk.svg#monotoon_kkregular') format('svg');
}

.p {
    font-family: monotoon, Impact ;
}


index.html

[...]
  <span class="p">ici la phrase</span>
[...]


Je suis passé effectivement par fontsquirrel.com à partir du ttf
Mais le plus grave ce n'est pas que le texte ne soit pas en monotoon, mais il n'est pas non plus en impact.
0
bg62 Messages postés 23724 Date d'inscription   Statut Modérateur Dernière intervention   2 408
 
ah ... et 'impact' sort de où ???
0
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   738
 
voici déja un lien expliquant les chemin vers les fichiers
https://www.alsacreations.com/astuce/lire/78-quelle-est-la-diffrence-entre-les-chemins-relatifs-et-absolus.html
ensuite dans ton code tu as oublié les virgules, les guillemets autour de monotoon ainsi que la 1ère déclaration eot sans déclaration de format et avec un point virgule. (compare l'exemple donné et ton code)

ensuite après la virgule (impact) c'est la police de remplacement au cas ou font-face n'est pas pris en charge.
il faut donc que ce soit installé sur l'ordi du visiteur dans l'emplacement reservé aux fonts du système d'exploitation et sous un format accepté par le navigateur. En general on mets une (ou plusieurs) police de remplacement qui soit très générique.
0

Discussions similaires

Pb de verrouillage de tel avec family link
Lylodjoud -
MAEVA -

3 réponses
Utilisation abusive family link possible?
Maya1980- -
Raphael -

1 réponse
Family link : les temps ne correspondent pas !
Barfly -
Sybant -

4 réponses
Appareil verrouillé / family link
Yllan -
Hdie -

12 réponses
supprimer appareil family link
papps -
MPMP10 -

1 réponse