HTML - Balises de phrase
Les balises de phrase ont été conçues à des fins spécifiques, bien qu'elles s'affichent de la même manière que les autres balises de base comme <b>, <i>, <pre>, et <tt>, vous avez vu dans le chapitre précédent. Ce chapitre vous présentera toutes les balises de phrase importantes, alors commençons à les voir une par une.
Texte accentué
Tout ce qui apparaît à l'intérieur <em>...</em> L'élément est affiché sous forme de texte mis en valeur.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Emphasized Text Example</title>
</head>
<body>
<p>The following word uses an <em>emphasized</em> typeface.</p>
</body>
</html>Cela produira le résultat suivant -
Texte marqué
Tout ce qui apparaît à l'intérieur <mark>...</mark> élément, s'affiche comme marqué à l'encre jaune.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Marked Text Example</title>
</head>
<body>
<p>The following word has been <mark>marked</mark> with yellow</p>
</body>
</html>Cela produira le résultat suivant -
Texte fort
Tout ce qui apparaît à l'intérieur <strong>...</strong> L'élément est affiché comme texte important.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Strong Text Example</title>
</head>
<body>
<p>The following word uses a <strong>strong</strong> typeface.</p>
</body>
</html>Cela produira le résultat suivant -
Abréviation de texte
Vous pouvez abréger un texte en le plaçant dans les balises d'ouverture <abbr> et de fermeture </abbr>. S'il est présent, l'attribut title doit contenir cette description complète et rien d'autre.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Text Abbreviation</title>
</head>
<body>
<p>My best friend's name is <abbr title = "Abhishek">Abhy</abbr>.</p>
</body>
</html>Cela produira le résultat suivant -
Élément acronyme
le <acronym> element vous permet d'indiquer que le texte entre les balises <acronym> et </acronym> est un acronyme.
À l'heure actuelle, les principaux navigateurs ne modifient pas l'apparence du contenu de l'élément <acronym>.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Acronym Example</title>
</head>
<body>
<p>This chapter covers marking up text in <acronym>XHTML</acronym>.</p>
</body>
</html>Cela produira le résultat suivant -
Direction du texte
le <bdo>...</bdo> element signifie Remplacement bidirectionnel et il est utilisé pour remplacer la direction actuelle du texte.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Text Direction Example</title>
</head>
<body>
<p>This text will go left to right.</p>
<p><bdo dir = "rtl">This text will go right to left.</bdo></p>
</body>
</html>Cela produira le résultat suivant -
Des conditions spéciales
le <dfn>...</dfn>element (ou HTML Definition Element) vous permet de spécifier que vous introduisez un terme spécial. Son utilisation est similaire aux mots italiques au milieu d'un paragraphe.
En règle générale, vous utiliseriez l'élément <dfn> la première fois que vous introduisez un terme clé. Les navigateurs les plus récents affichent le contenu d'un élément <dfn> dans une police italique.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Special Terms Example</title>
</head>
<body>
<p>The following word is a <dfn>special</dfn> term.</p>
</body>
</html>Cela produira le résultat suivant -
Texte de citation
Lorsque vous souhaitez citer un passage d'une autre source, vous devez le mettre entre <blockquote>...</blockquote> Mots clés.
Le texte à l'intérieur d'un élément <blockquote> est généralement mis en retrait par rapport aux bords gauche et droit du texte environnant, et utilise parfois une police en italique.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Blockquote Example</title>
</head>
<body>
<p>The following description of XHTML is taken from the W3C Web site:</p>
<blockquote>XHTML 1.0 is the W3C's first Recommendation for XHTML,following on
from earlier work on HTML 4.01, HTML 4.0, HTML 3.2 and HTML 2.0.</blockquote>
</body>
</html>Cela produira le résultat suivant -
Citations courtes
le <q>...</q> L'élément est utilisé lorsque vous souhaitez ajouter un guillemet double dans une phrase.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Double Quote Example</title>
</head>
<body>
<p>Amit is in Spain, <q>I think I am wrong</q>.</p>
</body>
</html>Cela produira le résultat suivant -
Citations de texte
Si vous citez un texte, vous pouvez indiquer la source en le plaçant entre une ouverture <cite> étiquette et fermeture </cite> marque
Comme vous vous en doutez dans une composition imprimée, le contenu de l'élément <cite> est rendu par défaut en texte en italique.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Citations Example</title>
</head>
<body>
<p>This HTML tutorial is derived from <cite>W3 Standard for HTML</cite>.</p>
</body>
</html>Cela produira le résultat suivant -
Code informatique
Tout code de programmation devant apparaître sur une page Web doit être placé à l'intérieur <code>...</code>Mots clés. Habituellement, le contenu de l'élément <code> est présenté dans une police à espacement fixe, tout comme le code de la plupart des manuels de programmation.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Computer Code Example</title>
</head>
<body>
<p>Regular text. <code>This is code.</code> Regular text.</p>
</body>
</html>Cela produira le résultat suivant -
Texte du clavier
Lorsque vous parlez d'ordinateurs, si vous voulez dire à un lecteur d'entrer du texte, vous pouvez utiliser le <kbd>...</kbd> élément pour indiquer ce qui doit être saisi, comme dans cet exemple.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Keyboard Text Example</title>
</head>
<body>
<p>Regular text. <kbd>This is inside kbd element</kbd> Regular text.</p>
</body>
</html>Cela produira le résultat suivant -
Variables de programmation
Cet élément est généralement utilisé en conjonction avec le <pre> et <code> éléments pour indiquer que le contenu de cet élément est une variable.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Variable Text Example</title>
</head>
<body>
<p><code>document.write("<var>user-name</var>")</code></p>
</body>
</html>Cela produira le résultat suivant -
Sortie du programme
le <samp>...</samp> L'élément indique un exemple de sortie d'un programme, d'un script, etc. Encore une fois, il est principalement utilisé pour documenter des concepts de programmation ou de codage.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Program Output Example</title>
</head>
<body>
<p>Result produced by the program is <samp>Hello World!</samp></p>
</body>
</html>Cela produira le résultat suivant -
Texte d'adresse
le <address>...</address> élément est utilisé pour contenir n'importe quelle adresse.
Exemple
<!DOCTYPE html>
<html>
<head>
<title>Address Example</title>
</head>
<body>
<address>388A, Road No 22, Jubilee Hills - Hyderabad</address>
</body>
</html>Cela produira le résultat suivant -