[Élément HTML] Explication détaillée du texte de balisage-tutoriel HTML-php.cn

[Élément HTML] Explication détaillée du texte de balisage

高洛峰

Libérer： 2017-02-18 15:19:02

original

1039 Les gens l'ont consulté

L'éditeur suivant vous apportera une explication détaillée du texte de balisage [élément HTML]. L'éditeur le trouve plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence pour tout le monde. Suivons l'éditeur et jetons un coup d'œil ensemble

1. Utilisez des éléments de texte de base pour marquer le contenu

Premier coup d'œil à l'effet d'affichage :

【HTML 元素】标记文字详解

correspond au code HTML :

Code XML/HTMLCopier le contenu dans le presse-papier

<!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>

Copier après la connexion

Style d'élément correspondant :

Code XML/HTMLCopier le contenu dans le presse-papiers

*一般表示关键词和产品名称*   
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;}

Copier après la connexion

2. Utilisez les éléments de langage

éléments ruby, rt et rp, regardez d'abord l'effet :

【HTML 元素】标记文字详解

Code correspondant :

Code XML/HTMLCopier le contenu dans le presse-papiers

<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>

Copier après la connexion

3. Contenu préformaté L'utilisation de l'élément

pre peut modifier la façon dont le navigateur gère le contenu, empêchant la fusion des caractères d'espacement, permettant ainsi de préserver le formatage du document source.

【HTML 元素】标记文字详解

Code XML/HTMLCopier le contenu dans le presse-papiers

<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>

Copier après la connexion

L'explication détaillée ci-dessus du texte de balisage [élément HTML] est tout le contenu partagé par l'éditeur. J'espère qu'elle pourra vous donner une référence, et j'espère. tout le monde Duoduo prend en charge le site Web chinois PHP.

Pour des explications plus détaillées sur le texte marqué [Éléments HTML] et les articles associés, veuillez faire attention au site Web PHP chinois !