[résolu] Changer les fontes des titres

FramboisierFramboisier Member
février 2018 modifié dans Entraide
Bonjour,
je veux changer la fonte des titres de mes articles comme indiqué dans le tuto http://pluxopolis.net/article27/donnez-du-style-a-vos-titres#form.
Pourtant je n'y arrive pas, qqchose coïnce qqpart, mais où? Comme je sèche depuis pas mal d'heures déjà là-dessus, je viens demander votre aide.
J'ai d'abord essayé KaushanScript de chez Fontsquirrel, sous tous les angles, et comme ça ne passait pas, j'ai essayé avec desyrelregular comme dans le tuto, mais y veut toujours pas, sauf la nouvelle couleur qui passe très bien...
Voilà mon thème.css modifié:


/*
Main
*/

@font-face {
font-family: 'desyrelregular';
src: url(../fonts/'desyrel-webfont.woff2') format('woff2'),
url(../fonts/'desyrel-webfont.woff') format('woff');
url(../fonts/'desyrel.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
.main {


.....et.....


.article header h2 a {
font-family: 'desyrelregular';
color: #68a9ed;
}
.article header h2 a:hover {
font-family: 'desyrelregular';
color: #258fd6;
text-decoration: none;
}


et voici mes fichiers fontes:
grjMPbBJXV8C.png
grjMPbBJXV8C.png


NB: - j'ai aussi essayé avec le chemin écrit sous la forme: url(fonts/'desyrel...
- mon navigateur = Firefox

Voyez-vous mon erreur? Pouvez-vous m'orienter vers la solution? Merci d'avance pour votre attention.

Réponses

  • GzygGzyg Member
    février 2018 modifié
    Salut,

    Remplace le point-virgule après ('woff') par une virgule.


    à plus,

    Gzyg
  • Bonjour Gzyg,

    j'ai corrigé et rafraîchi la page en vidant le cache mais rien n'a bougé,
    verrais-tu autre chose ?
  • GzygGzyg Member
    février 2018 modifié
    Oui. :)

    En fait, ce sont tes url de police qui sont mal formées (les apostrophes sont mal placées).

    Essaie comme ceci :
    [== Indéfini ==]
    @font-face {
        font-family: 'desyrelregular';
        src: url('../fonts/desyrel-webfont.woff2') format('woff2'),
             url('../fonts/desyrel-webfont.woff') format('woff');
             url('../fonts/desyrel.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
    

    De plus :

    Seul le format woff est vraiment nécessaire (le woff2 n'est pas encore lu par tous le navigateurs et le truetype est fait pour les très anciens, style ie7, ie8) ;

    Tu DOIS ajouter une famille de police générique correspondant à ta fonte embarquée dans tes règles CSS (serif, sans-serif ou monospace).
    Par exemple : font-family: 'desyrel', sans-serif;

    Aussi, il est inutile de répéter la règle font-family pour le a:hover puisque c'est la même police que a.


    à plus,

    Gzyg
  • !!!!! YESSSSSSS !!!!!

    Dans le mille, Gzyg, merci infiniment !

    ! un aussi petit détail (deux avec le point-virgule), et tout est bouleversé ! Merci de l'avoir repéré.
    aux yeux du profane que je suis, c'est dingue ! Première leçon de css donc...
    Et ça change radicalement la tronche de ma page. Parfait, ça me donne des ailes pour la suite ! :)
Connectez-vous ou Inscrivez-vous pour répondre.