Personnaliser sa font avec font-face
Bonjour
J'aimerais appliquer une font spéciale pour le titre de ma page.
Pour cela j'ai téléchargé la font dans mon dossier /font.
Puis, dans mon fichier css, j'ai ajouté ceci
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
@font-face{
font-family:"texgyreadventor";
src: url("../fonts/texgyreadventor-regular.otf") format("otf");
}
body{
font-size: 12px;
font-family: verdana;
}
.logo{
font-family: "texgyreadventor", verdana;
font-size: 20px;
} |
L'objectif est donc de n'avoir que la font voulu pour le contenu de '.logo'
Il se trouve que toute ma page à la font voulu, alors que toutes cette page devrait avoir la font verdana. Je ne comprends pas pourquoi, car dans body, je demande bien la versana???
Autre chose, dans le zip de la font que j'ai téléchargé, j'ai plusieurs variantes:
texgyreadventor-bold.otf
texgyreadventor-bolditalic.otf
texgyreadventor-italic.otf
texgyreadventor-regular.otf
Comment dois-je modifier ma ligne font-face, pour pouvoir utiliser la variante bold, italic, etc?
Dois.je créer plusieurs font-face comme cela
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| @font-face{
font-family:"texgyreadventor";
src: url("../fonts/texgyreadventor-regular.otf") format("otf");
}
@font-face{
font-family:"texgyreadventor-bold";
src: url("../fonts/texgyreadventor-bold.otff") format("otf");
}
@font-face{
font-family:"texgyreadventor-bolditalic";
src: url("../fonts/texgyreadventor-bolditalic.otff") format("otf");
}
@font-face{
font-family:"texgyreadventor-italic";
src: url("../fonts/texgyreadventor-italic.otf") format("otf");
} |
Ou puis définir les variantes dans une section $font-face?
Merci et belle soirée
