Heim > Artikel > Web-Frontend > [HTML-Element] Detaillierte Erläuterung des Markup-Textes
[HTML-Element] Detaillierte Erläuterung des Markup-Textes
- 高洛峰Original
- 2017-02-18 15:19:021034Durchsuche
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:
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>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;}2. Verwenden Sie Sprachelemente
Ruby-, RT- und RP-Elemente. Sehen Sie sich zunächst den Effekt an:
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>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.
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>
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!