Le texte en gras avec le CSS
Le langage HTML permet facilement de mettre un texte en gras. Mieux encore, des notions du CSS peuvent également vous servir et compléter votre document HTML. Cette dernière méthode vous permet de gagner en temps. Aussi, vous avez clairement connaissance du volume du texte mis en gras. Vous vous demandez comment arriver à mettre votre texte en gras à l’aide du CSS ? Découvrez dans cet article comment le CSS peut vous servir à mettre un texte en gras.
Plan de l'article
- Faire usage du CSS en cas de nécessité
- User de la balise <span>
- Faire usage de l’attribut <<style>>
- Insérer la prérogative << font-weight >>
- Insérer le caractère << bold >>
- Utiliser la propriété CSS ‘font-weight’ pour mettre en gras un texte spécifique
- Utiliser des classes CSS pour appliquer le style gras à différents éléments de texte
Faire usage du CSS en cas de nécessité
Le CSS est le meilleur guide pour une mise en forme de votre page web. Il s’agit d’une puissante ressource utilisée pour refléter l’image de votre page web. Par contre, le HTML est : dédié à faire ressortir le sens d’une page web. C’est bien l’objectif d’opter pour le langage HTML afin d’attirer l’attention sur une partie d’un texte. Mais, les notions du CSS vous donnent plus d’aisance dans la présentation en gras de votre texte.
Lire également : Huawei anticipe un zoom optique 10x pour le Huawei P30 Pro
Pour utiliser le CSS, il vous faut ouvrir une page HTML par divers navigateurs. Vous constatez d’éventuelles dissemblances dans les affichages. À l’aide d’une balise spécifique, le CSS ordonne aux navigateurs la meilleure manière d’afficher les pages. Les dissemblances sont, ainsi minimisées.
User de la balise <span>
Lorsque vous ne maîtrisez pas le CSS, pour un début, servez-vous du « CSS en ligne ». Grâce au CSS, vous pouvez modifier les balises <p> ou <h1> d’un texte. Au cas où vous voudriez arranger un texte hors balises, servez-vous de la balise <span></span>. Il suffit d’insérer votre texte entre <span> et </ span>. La balise n’assure pas la mise en gras, mais vous donne accès à la piste de travail.
Lire également : SONY dévoile le Xperia M
Ainsi, comme exemple, vous pouvez taper sur votre navigateur : <span>J’ai acquis de nouvelles connaissances sur la mise en gras d’un texte à l’aide du CSS en ligne</span>. Après cela, votre texte apparaît en gras. À cause de cet indice, votre texte s’affiche pareillement sur tous les navigateurs.
Faire usage de l’attribut <<style>>
En langage HTML, les attributs sont directement insérés dans la balise, entre les crochets. Toutefois, l’attribut <<style>> a son importance lorsque vous voulez faire usage du CSS dans la balise HTML. Ceci étant, on insère style= au sein de la balise << span >>.
En pratique, à titre d’exemple, l’usage de l’attribut<<style>> se définit comme suit. <span style=> J’ai compris que l’usage de style= est important pour le CSS en ligne.</span>. En réalité, l’attribut <<style>> vous donne la possibilité de préciser le style désiré pour votre texte en gras. Donc, il est inutile de l’ajouter si vous ne précisez pas le style.
Insérer la prérogative << font-weight >>
Pour mettre en valeur les qualités du CSS, on utilise l’attribut <<style>>. Il existe également autres attributs pour des fonctions spécifiques. La prérogative << font-weight >> permet de varier la taille de la police. Ce trait unique peut servir à la mise en gras de votre texte. Ou encore pour réduire la police de votre texte. Il indique mieux aux navigateurs, la taille réelle et normale qui doit être affichée pour chaque texte.
En pratique, il vous suffit d’insérer « font-weight » après l’indice << = >>. Par exemple : <span style= « font-weight: »>j’ai davantage appris sur l’usage du » font-weight » à partir du CSS en ligne </span>. Les guillemets qui encadrent » font-weight » ne doivent pas être omis.
Insérer le caractère << bold >>
La valeur << bold >> vient compléter celle << font-weight >>. En matière d’épaisseur, il y a une grande variété de taille. Mais, la valeur << bold >> est la mieux adaptée. Son usage est largement accessible. Ainsi, vous insérez <span style= « font-weight:bold »>J’ai largement appris sur l’épaisseur convenable aux textes en gras à partir du CSS en ligne</span>.
Par ailleurs, le CSS vous donne l’accès à une plus grande variété d’options pour faire remarquer votre texte. En lieu et place de la valeur << bold >>, vous pouvez utiliser << bolder >>, << normal >>, << 900 >>. Ces différents caractères apportent d’une manière ou d’une autre une spécificité à votre travail. La valeur << bolder >> rend votre texte plus épais lorsque vous l’utilisez. Les caractères << normal >> et << 900 >> agissent également sur l’épaisseur. Vous pouvez utiliser autres indices entre 100 et 900 en lieu et place de 900.
Utiliser la propriété CSS ‘font-weight’ pour mettre en gras un texte spécifique
La propriété CSS ‘font-weight’ est un outil essentiel pour mettre en gras un texte spécifique sur une page web. En utilisant cette propriété, vous avez la possibilité d’ajouter de l’emphase et de la visibilité à certains éléments textuels.
Pour utiliser la propriété ‘font-weight’, il suffit de sélectionner l’élément HTML que vous souhaitez mettre en gras, puis d’appliquer la valeur appropriée à la propriété. Les valeurs couramment utilisées sont ‘bold’ (gras) et ‘normal’ (normal), mais il existe aussi des variations intermédiaires comme ‘bolder’ et ‘lighter’.
Par exemple, si vous souhaitez mettre en gras le titre principal d’un article, vous pouvez ajouter du code CSS tel que:
Vous devez noter que toutes les polices ne prennent pas en charge toutes les variations d’épaisseur. Certains caractères peuvent apparaître identiques ou légèrement différents avec différentes valeurs de poids. Il est donc recommandé de tester différentes options pour trouver celle qui convient le mieux au style global du site web.
En plus des valeurs prédéfinies, il est aussi possible d’utiliser des nombres spécifiques pour définir un poids personnalisé. Par exemple, une valeur numérique inférieure à 400 rendra le texte moins épais tandis qu’une valeur supérieure à 700 le rendra plus épais.
Grâce à la flexibilité offerte par la propriété CSS ‘font-weight’, vous pouvez facilement personnaliser l’apparence du texte gras sur votre site web selon vos besoins et votre esthétique.
Utiliser des classes CSS pour appliquer le style gras à différents éléments de texte
Lorsque vous souhaitez appliquer le style gras à plusieurs éléments de texte sur une page web, il peut être fastidieux d’ajouter manuellement la propriété ‘font-weight’ à chaque balise. Heureusement, en utilisant des classes CSS, vous pouvez simplifier cette tâche et rendre votre code plus modulaire.
Pour commencer, vous devez définir une classe CSS spécifique pour le style gras que vous souhaitez appliquer. Par exemple, vous pouvez créer une classe appelée ‘bold-text’.
Une fois que la classe est créée, il suffit de l’attribuer aux éléments HTML que vous souhaitez mettre en gras en ajoutant simplement l’attribut ‘class’ avec la valeur correspondante.