La fonction polygones
avec font-weight il est possible de donner au texte une valeur normale, grasse avec bold, ou encore plus gras avec bolder ou bien lighter
La propriété CSS "font-weight" permet de définir l'épaisseur de la police utilisée dans un élément HTML. Elle peut être utilisée pour mettre en valeur du texte ou pour créer des contrastes visuels.
Avec la propriété font-weight il est possible de donner au texte une valeur normale, grasse avec bold, ou encore plus gras avec bolder ou bien lighter
La propriété de feuille de style css font-weight permet de spécifier la graisse (mettre en gras)
Dans le code CSS suivant on va utiliser les classes
Code css :Exemple Copier le code
p.normal {font-weight:normal}
p.thick {font-weight:bold}
p.thicker {font-weight:900}
| Valeurs par défaut | normal |
|---|---|
| Inherited: | oui |
| Animable : | non En savoir plus sur l'animable |
| Version: | CSS1 |
| Syntaxe JavaScript: | object.style.fontWeight="900" |
| Valeur | Description |
|---|---|
| normal | Définit les caractères normaux. Par défaut |
| bold | Définit les caractères épais |
| bolder | Définit les caractères plus épais |
| lighter | Définit les caractères légers |
| 100 200 300 400 500 600 700 800 900 |
Définit un échelle d'épaisseur des caractères. 400 est la même valeur que la normale, et 700 est le même valeur que le gras |
Exemple Copier le code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title> Animation du poids de la police</title>
<style>
#monDIV {
border: 1px solid black;
width: 500px;
font-size:20px;
animation: monAnimation 5s infinite;
}
@keyframes monAnimation {
50% {font-weight: 900;}
}
</style>
</head>
<body>
<h1>Animation du poids de la police : propriété css font-weight</h1>
<p>Modifiez progressivement l'épaisseur de la police de normal à gras, puis revenez à la normale :<p>
<div id="monDIV">
<p>Voici un paragraphe avec du texte.</p>
</div>
</body>
</html>