Comment mettre du texte en gras en HTML?


153

J'essaie de mettre du texte en gras en utilisant HTML, mais j'ai du mal à le faire fonctionner.

Voici ce que j'essaye:

Some <bold>text</bold> that I want emboldened.

Quelqu'un pourrait-il me dire ce que je fais de mal?


17
Je suis d'accord pour dire qu'il devrait d'abord être recherché sur google, mais je pense que le point est que la prochaine fois que quelqu'un cherche sur google, il / elle sera dirigé vers SO, ce que je considère comme une bonne chose. Plus de trafic et de personnes venant sur SO.
Andrija

@binfolder voudra peut-être dire s'il a appris <bold> de Google ou non. Autre possibilité, plus générale: de plus en plus de personnes se développent sans école et sans lecture de livres. Nous avons appris cela le "premier jour" ou "le deuxième jour" de "HTML 101". Ils n'ont pas de cours programmés.
John Saunders

2
@Andrija: Je suis d'accord pour les diriger ici. C'est pourquoi ma réponse les a renvoyés vers un endroit où ils peuvent apprendre la réponse à la question suivante: "comment faire l'italique?"
John Saunders

Réponses:


222

utiliser <strong>ou <b>tag

aussi, vous pouvez essayer avec css <span style="font-weight:bold">text</span>


53

HTML n'a pas de <bold>balise, vous devrez plutôt l'utiliser <b>. Notez cependant que l'utilisation <b>est déconseillée au profit de CSS depuis un moment . Vous feriez mieux d'utiliser CSS pour y parvenir.

La <strong>balise est un élément sémantique pour une forte accentuation qui par défaut est gras.


2
+1 b est HTML 4, vous ne devriez jamais être fort / css est la voie à suivre
googletorp

<b> n'a jamais été obsolète. Recommandé contre en faveur de <em>, <strong>, <h1..6>, etc., oui; obsolète, non.
Noah Medling le

Pourquoi l'utilisation devrait-elle <b>être découragée en faveur du CSS? C'est comme dire que l'utilisation de <h* n* >est déconseillée en faveur de CSS. C'est dans la norme alors utilisez-le.
Gumbo le

Gumbo: De w3.org/TR/html4/present/graphics.html#h-15.2.1 - "Les éléments HTML suivants spécifient les informations de police. Bien qu'ils ne soient pas tous obsolètes, leur utilisation est déconseillée au profit des feuilles de style."
Joey le

1
En fait, ces éléments font un retour en HTML 5 comme "éléments de phrase" - par exemple <small> symbolise les petits caractères, tandis que <b> doit être utilisé pour les titres de livres, je pense.
DisgruntledGoat

21

La méthode du balisage:

<strong>I'm Bold!</strong> and <b>I'm Bold Too!</b>

La façon de styliser:

.bold {
  font-weight:bold;
}

<span class="bold">I'm Bold!</span>

De: http://www.december.com/html/x1/

<b>

Cet élément renferme du texte qui doit être rendu par le navigateur en gras. Étant donné que la signification de l'élément B définit l'apparence du contenu qu'il englobe, cet élément est considéré comme un élément de balisage "physique". En tant que tel, il ne transmet pas la signification d'un élément de balisage sémantique tel que strong.

<strong>

Description Cet élément met entre crochets le texte qui doit être fortement souligné. Plus fort que l'élément em.


3
strongn'est pas la même chose que b.
Gumbo

8
Jamais dit qu'ils l'étaient.
Sampson le

12

En Html, utilisez:

  • Un <b>texte </b>que je veux enhardi.
  • Un <strong>texte </strong>que je veux enhardi.

En utilisation CSS:

  • Un <span style="font-weight:bold">texte </span>que je veux enhardi.

7

Quelqu'un pourrait-il me dire ce que je fais de mal? "

"bold" n'a jamais été un élément HTML ("b" est la correspondance la plus proche).

Le HTML doit contenir un contenu structuré; l'éditeur CSS devrait suggérer des styles pour ce contenu. De cette façon, les agents utilisateurs peuvent exposer le contenu structuré avec des commandes de style et de navigation utiles aux utilisateurs qui ne peuvent pas voir votre style audacieux suggéré (par exemple, les utilisateurs de moteurs de recherche, les utilisateurs totalement aveugles utilisant des lecteurs d'écran, les utilisateurs malvoyants utilisant leurs propres couleurs et polices, utilisateurs geek utilisant des navigateurs texte, utilisateurs de navigateurs vocaux et vocaux comme Opera pour Windows). Ainsi, la bonne façon de mettre du texte en gras dépend de la raison pour laquelle vous souhaitez le mettre en gras. Par exemple:

  • Vous voulez distinguer les titres des autres textes? Utilisez des éléments d'en-tête ("h1" à "h6") et suggérez-leur un style gras dans votre CSS ("h1, h2, h3, h4, h5, h6 {font-weight: bold;}".

  • Vous voulez enrichir les étiquettes des champs de formulaire? Utilisez un élément "label", associez-le par programmation à l'élément "select", "input" ou "textarea" correspondant en lui attribuant un attribut "for" correspondant à un attribut "id" sur la cible, et suggérez un style gras pour dans votre CSS ("label {font-weight: bold;"}).

  • Vous voulez enhardir un en-tête pour un groupe de domaines connexes dans un formulaire, tel qu'un groupe de choix radio? Entourez-les d'un élément "fieldset", donnez-lui un élément "legend" et suggérez-lui un style gras dans votre CSS ("legend {font-weight: bold;}").

  • Vous voulez distinguer une légende de tableau des légendes de table? Utilisez un élément "caption" et suggérez-lui un style gras dans votre CSS ("caption {font-weight: bold;}").

  • Vous voulez distinguer les en-têtes de tableau des cellules de données de tableau? Utilisez un élément "th" et suggérez-lui un style gras dans votre CSS ("th {font-weight: bold;}").

  • Vous voulez distinguer le titre d'un film ou d'un album référencé du texte environnant? Utilisez un élément "cite" avec une classe ("cite class =" movie-title ") et suggérez-lui un style gras dans votre CSS (" .movie-title {font-weight: bold;} ").

  • Vous voulez distinguer un mot-clé défini du texte environnant le définissant ou l'expliquant? Utilisez un élément "dfn" et suggérez-lui un style gras dans votre CSS ("dfn {font-weight: bold;}").

  • Vous voulez distinguer un code informatique du texte environnant? Utilisez un élément "code" et suggérez-lui un style gras dans votre CSS ("code {font-weight: bold;}").

  • Vous voulez distinguer un nom de variable du texte environnant? Utilisez un élément "var" et suggérez-lui un style gras dans votre CSS ("var {font-weight: bold;}").

  • Vous souhaitez indiquer que du texte a été ajouté en tant que mise à jour? Utilisez un élément "ins" et suggérez-lui un style gras dans votre CSS ("ins {font-weight: bold;}").

  • Vous voulez insister légèrement sur un texte (" J'adore les chatons!")? Utilisez un élément "em" et suggérez-lui un style gras dans votre CSS (par exemple "em {font-weight: bold;}").

  • Vous voulez insister fortement sur un texte, peut-être pour un avertissement (" Attention au chien! ")? Utilisez un élément "strong" et suggérez-lui un style gras dans votre CSS (par exemple "strong {font-weight: bold;}").

… Vous avez l'idée (espérons-le).

Vous ne trouvez pas d'élément HTML avec la bonne sémantique pour exprimer / pourquoi / vous voulez mettre ce texte en gras? Enveloppez-le dans un élément générique "span", donnez-lui un nom de classe significatif qui exprime votre justification pour distinguer ce texte ("<span class =" lede "> Permettez-moi de commencer cet article par une phrase qui le résume. </ Span >), et suggérez-lui un style gras dans votre CSS (".lede {font-weight: bold;"}. Avant de créer vos propres noms de classe, vous voudrez peut-être vérifier s'il existe un microformat (microformats.org) ou convention commune pour ce que vous voulez exprimer.


Donc en résumé {link_to_HTML_element {font-weight: bold; }}
James H

6

L'élément HTML définit le texte en gras, sans aucune importance supplémentaire.

<b>This text is bold</b>

L'élément HTML définit un texte fort, avec une importance sémantique "forte" ajoutée.

<strong>This text is strong</strong>

5

Une autre option est de le faire via CSS ...

Par exemple 1

<span style="font-weight: bold;">Hello stackoverflow!</span>

Par exemple 2

<style type="text/css">
    #text
    {
        font-weight: bold;
    }
</style>

<div id="text">
    Hello again!
</div>

4

Vous y êtes presque!

Pour un texte en gras, vous devriez avoir ceci: <b> bold text</b>ou <strong>bold text</strong>Ils ont le même résultat.

Exemple de travail - JSfiddle


2
Cette question a en fait été posée il y a sept ans et a déjà une solution (la bonne réponse a été publiée 3 minutes après avoir été posée). Donc votre réponse n'ajoute rien d'utile. Si vous voulez trouver des problèmes qui n'ont pas encore été résolus, tapez answers:0dans la zone de recherche en haut, qui vous donnera une liste de toutes les questions pour lesquelles aucune réponse n'a été publiée.
Mr Lister le

1
@MrLister IMO le lien vers JSfiddle est assez utile.
Χpẘ

3

C'est juste <b>au lieu de <bold>:

Some <b>text</b> that I want bolded.

Notez que <b>modifie simplement l'apparence du texte. Si vous souhaitez le rendre en gras parce que vous souhaitez exprimer une forte emphase, vous devriez mieux utiliser l' <strong>élément .


2

Je pense que la vraie réponse est http://www.w3schools.com/HTML/default.asp .


2
Exactement. Si vous ne savez pas comment mettre du texte en gras en HTML et que vous ne savez pas comment le savoir, vous devez commencer par la leçon 1.
myplacedk

2
@Gareth: qu'est-ce qui ne va pas avec w3schools et que considérez-vous comme la bonne réponse à quelqu'un qui ne connaît pas le HTML du premier jour? Ok, peut-être le deuxième jour si ce sont des jours courts.
John Saunders

C'était l'une des très rares fois où j'ai recommandé w3schools. Vis et apprend.
John Saunders
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.