Ah, on rentre dans le vif du sujet !Les polices d'écritures
Pour commencer, il faut savoir qu'il existe différentes polices d'écritures qui peuvent être utilisées, par défaut l'ensemble des navigateurs garantissent celle-ci :
- Arial
- Verdana
- Helvetica
- Tahoma
- Trebuchet MS
- Times New Roman
- Georgia
- Garamond
- Courier New
- Brush Script MT
font-family
Et on peut changer la police d'écriture avec la propriété font-family, mais attention, si le nom de police d'écriture contiens des espaces, il faut mettre ce nom entre guillemets :
On peut lui préciser plusieurs valeurs séparées par des virgules, et le navigateur essaiera d'utiliser la première s'il la connait, sinon il essaiera la deuxième, puis la troisième, jusqu'à en trouver une qu'il connait.
Mais à quoi ça sert vu qu'il les connait toutes de toute façon?@font-face
Parce que l'on peut aussi charger des fichiers de police d'écriture personnalisés pour les utiliser en css, pour cela on utilise @font-face de cette façon :
{"language":"text/css","content":"@font-face{\n\tfont-family: \"nom de la font pour l'utiliser plus tard\",\n\tsrc: url(\"url du fichier de font à charger\") format(\"format du fichier de font\"),\n\tsrc: url(\"url du fichier de font à charger\") format(\"un autre format du fichier de font\");\n}","filename":""}
Et pourquoi tu mets plusieurs lignes url?Parce qu'il existe de nombreux formats pour les fichiers de police d'écriture et tous les navigateurs n'acceptent pas tous les formats de fichiers, donc il faut en préciser un maximum pour garantir que la police sera bien chargée sur tous les navigateurs. Mais cette technique avec font-face est un peu dépassée, et surtout pas très stable, il arrive qu'avec les fichiers dans le bon format, un navigateur ne prenne pas en compte la police pour autant, ça n'a jamais été très stable à utiliser.
Ah... Et il existe un autre moyen?Google font
Oui, il existe des sites qui font office d'hébergement de fichiers de police d'écriture et proposent des méthodes faciles pour les charger. Par exemple Google font permet de sélectionner des polices d'écriture dans une bibliothèque qui en compte des milliers et un utilitaire permet d'en choisir une ou plusieurs et génère un <link> à ajouter dans les en-têtes html pour qu'elles soient chargées, on peut ensuite les utiliser directement avec font-family.
C'est pratique ça !Effectivement, ça fait gagner pas mal de temps, et facilite la tâche.
La taille de police
Pour en revenir aux textes, on peut modifier la taille d'une police en CSS, je l'avais déjà fait précédemment, donc tu as du comprendre que je parlais de font-size.
Effectivement je l'avais déjà identifié dans des exemples que tu m'avais fait avant.Rien de compliqué avec celle-ci, par défaut sa valeur est à 16px, mais on peut la modifier, en pixel, en em, en rem, en % et avec toutes les notations de taille que tu connais par cœur maintenant.
Oui, je connais tout ça. Mais tu en recommandes une en particulier?Le em et rem sont très adaptés aux texte, il est généralement recommandé d'utiliser celles-ci.
Je note ça.Les styles
On peut aussi appliquer différents styles à une police, pour changer l'apparence de certains mots ou certaines phrases.
font-style
Par exemple avec font-style, on peut décider d'écrire un texte en italique ou en oblique :
Je ne vois pas la différence entre italique et oblique... C'est normal?Il n'y a pas toujours de différences, certaines polices intègrent un style particulier pour l'oblique, qui sera différent de l'italique, d'autres non, elle seront alors affichées en italique.
font-weight
On peut aussi mettre le texte plus ou moins en gras, de la même façon selon ce que permet la police que l'on utilise. Il faut pour cela utiliser font-weight avec une valeur entre 100 et 900, 100 étant très fin et 900 très épais. Je te fais un exemple avec la police Roboto chargée de google font.
Ah pas mal, je vois qu'on peut vraiment faire beaucoup de choses en css.font-variant
On peut aussi utiliser un variant d'affichage avec la propriété font-variant en small-caps. Ainsi toute les lettres minuscules s'afficheront avec les caractères majuscules en plus petit.
Je ne suis pas sûr de m'en servir un jour de celui là.On ne s'en sert pas tous les jours effectivement, mais c'est toujours bien de savoir que c'est possible le jour où on en a besoin. J'ai terminé cette partie