Vous vous demandez comment mettre en gras en CSS ?
Il faut dire que c’est une méthode très utile pour mettre en évidence du contenu sur une page web.
À ce sujet, voici comment procéder de manière simple et efficace à l’aide de la propriété font-weight.
1. La propriété font-weight
La propriété font-weight est utilisée en CSS pour contrôler l’épaisseur du texte.
Pour mettre du texte en gras, il suffit de définir cette propriété avec la valeur bold.
Exemple :
.gras {
font-weight: bold;
}
Ici, .gras est une classe CSS. Vous appliquez ensuite cette classe à n’importe quel élément HTML pour rendre son texte en gras :
<p class="gras">Ce texte est en gras.</p>
2. Utiliser des valeurs numériques pour font-weight
En plus de bold, vous pouvez utiliser des valeurs numériques avec font-weight.
Ces valeurs vont de 100 (le plus fin) à 900 (le plus épais).
- 100
- 200
- 300
- 400
- 500
- 600
- 700
- 800
- 900
Pour information, font-weight: 700; étant similaire à bold.
Ce texte est en bold
Ce texte est en 700
3. Intégration dans une feuille de style externe
Pour information, en règle générale, il est toujours recommandé de séparer votre CSS de votre HTML pour une meilleure organisation.
Pour ce faire, vous devez créer un fichier CSS séparé, par exemple styles.css, et vous y définissez vos règles de style, comme celles mentionnées précédemment.
Ensuite, vous liez ce fichier CSS à votre document HTML avec une balise <link> :
<head>
<link rel="stylesheet" href="styles.css">
</head>
4. Utilisation dans des contextes spécifiques
Vous pouvez cibler des éléments spécifiques en utilisant des sélecteurs CSS tels que les classes, les identifiants, ou même des sélecteurs d’éléments. Par exemple, pour rendre en gras tous les titres <h2> de votre page :
h2 {
font-weight: bold;
}
Conclusion
Mettre du texte en gras avec CSS est simple et flexible. En utilisant la propriété font-weight, vous pouvez facilement styliser votre contenu en appliquant des classes CSS à vos éléments HTML. Cette méthode vous permet de gérer efficacement le style de votre site web en séparant le contenu (HTML) de la présentation (CSS).
