Heim > Web-Frontend > HTML-Tutorial > [HTML-Element] Detaillierte Erläuterung des Markup-Textes

[HTML-Element] Detaillierte Erläuterung des Markup-Textes

高洛峰
Freigeben: 2017-02-18 15:19:02
Original
1084 Leute haben es durchsucht

Der folgende Editor bietet Ihnen eine detaillierte Erklärung des [HTML-Element]-Markup-Textes. Der Herausgeber findet es ziemlich gut, deshalb werde ich es jetzt mit Ihnen teilen und es allen als Referenz geben. Folgen wir dem Editor und werfen wir gemeinsam einen Blick darauf

1. Verwenden Sie grundlegende Textelemente, um Inhalte zu markieren

Sehen Sie sich zunächst den Anzeigeeffekt an:

【HTML 元素】标记文字详解

entspricht HTML-Code:

XML/HTML-CodeInhalt in die Zwischenablage kopieren

<!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>
Nach dem Login kopieren


Entsprechender Elementstil:

XML/HTML-CodeKopieren Sie den Inhalt in die Zwischenablage

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

2. Verwenden Sie Sprachelemente

Ruby-, RT- und RP-Elemente. Sehen Sie sich zunächst den Effekt an:

【HTML 元素】标记文字详解

Entsprechender Code:


XML/HTML-CodeInhalt in die Zwischenablage kopieren

<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>
Nach dem Login kopieren


3. Vorformatierter Inhalt Durch die Verwendung des

pre-Elements kann die Art und Weise geändert werden, wie der Browser den Inhalt verarbeitet, wodurch verhindert wird, dass Leerzeichen zusammengeführt werden, sodass die Formatierung im Quelldokument erhalten bleibt.

【HTML 元素】标记文字详解


XML/HTML-CodeInhalt in die Zwischenablage kopieren

<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>  
Nach dem Login kopieren


Die obige detaillierte Erklärung des [HTML-Element]-Markup-Textes ist der gesamte vom Herausgeber geteilte Inhalt, und ich hoffe, dass er Ihnen eine Referenz geben kann Jeder Duoduo unterstützt die chinesische PHP-Website.

Ausführlichere Erläuterungen zu [HTML-Elementen] markiertem Text und verwandten Artikeln finden Sie auf der chinesischen PHP-Website!


Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage