Maison >interface Web >tutoriel HTML >Explication détaillée du texte de balisage HTML
Cette fois, je vais vous apporter une explication détaillée du texte de balisage HTML. Quelles sont les précautions pour le texte de balisage HTML. Voici des cas pratiques, jetons un coup d'œil.
. Marquez le contenu avec des éléments de texte de base
Code HTML correspondant :
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Learn4Font</title> </head> <body> <p> 元素 b —— <b> I am the example.</b></p> <p> 元素 em —— <em> I am the example.</em></p> <p> 元素 i —— <i> I am the example.</i></p> <p> 元素 s —— <s> I am the example.</s></p> <p> 元素 strong —— <strong> I am the example.</strong></p> <p> 元素 u —— <u> I am the example.</u></p> <p> 元素 small —— <small> I am the example.</small></p> <p> 元素 sub —— <sub> I am the example.</sub></p> <p> 元素 sup —— <sup> I am the example.</sup></p> </body> </html>
Style d'élément correspondant :
*一般表示关键词和产品名称* b{font-weight: bolder;} *一般表示加以强调* em {font-style: italic;} *一般表示外文词语或科技术语* i {font-style: italic;} *一般表示不准确或校正* s {text-decoration: line-through;} *一般表示重要文字* strong {font-weight: bolder;} *一般表示为文字添加下划线* u {text-decoration: underline;} *一般表示为添加小号字体内容* small {font-size: small;} *一般表示添加上标和下标* sup {vertical-align: sub; font-size: smaller;} sub {vertical-align: super; font-size:smaller;}
2. Utilisez des éléments de langage.
Éléments ruby, rt et rp, regardez d'abord l'effet :
Code correspondant :
<p style=" font-size: 3em;"> <ruby>魑<rp>(</rp><rt>chī</rt><rp>)</rp></ruby> <ruby>魅<rp>(</rp><rt>mèi</rt><rp>)</rp></ruby> <ruby>魍<rp>(</rp><rt>wǎng</rt><rp>)</rp></ruby> <ruby>魉<rp>(</rp><rt>liǎng</rt><rp>)</rp></ruby> </p>
Utiliser du contenu pré-formaté
pre peut modifier la façon dont le navigateur gère le contenu, empêchant la fusion des caractères d'espacement et permettant de préserver le formatage du document source.<pre class="brush:php;toolbar:false"> <code> var fruits = ["apples","oranges","mangoes","cherries"]; for(var i= 0; i < fruits.length; i++){ document.writeln("I like " + fruits[i]); } </code>Je pense que vous maîtrisez les méthodes après avoir lu ces cas. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php ! Lecture connexe :
Exemples détaillés de formatage de texte HTML
Comment implémenter les invites de la zone de saisie + le texte normal en h5 Invite de boîte
Explication détaillée des éléments du formulaire HTML Form
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!