【HTML-Element】Detaillierte Erklärung des Tag-Textes

【HTML-Element】Detaillierte Erklärung des Tag-Textes

1. Verwenden Sie grundlegende Textelemente, um Inhalte zu markieren

Schauen Sie sich zunächst den Anzeigeeffekt an:

Entsprechender HTML-Code:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <!DOCTYPE html >   
  2. < html   lang = "en" >   
  3. <Kopf>   
  4.      < Meta   Zeichensatz = "UTF-8" >   
  5.      <Titel> Learn4Font </Titel>   
  6. </ Kopf >   
  7. < Textkörper >   
  8. < p > Element b — < b > Ich bin das Beispiel. </ b > </ p >   
  9. < p > Element em — < em > Ich bin das Beispiel. </ em > </ p >   
  10. < p > Element i — < i > Ich bin das Beispiel. </ i > </ p >   
  11. < p > Element s — < s > Ich bin das Beispiel. </ s > </ p >   
  12. < p > Element strong -- < strong > Ich bin das Beispiel. </ strong > </ p >   
  13. < p > Element u — < u > Ich bin das Beispiel. </ u > </ p >   
  14. < p > Element small — < small > Ich bin das Beispiel. </ small > </ p >   
  15. < p > element sub — < sub > Ich bin das Beispiel. </ sub > </ p >   
  16. < p > Element sup —— < sup > Ich bin das Beispiel. </ sup > </ p >   
  17. </ Körper >   
  18. </ html >   

Entsprechender benutzerdefinierter Elementstil:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. *Bezieht sich im Allgemeinen auf Schlüsselwörter und Produktnamen*
  2. b{Schriftstärke: fetter;}
  3.   
  4. *Zeigt im Allgemeinen eine Betonung an*
  5. em {Schriftart: kursiv;}
  6.   
  7. *Bezieht sich im Allgemeinen auf Fremdwörter oder wissenschaftliche Begriffe*
  8. ich {Schriftart: kursiv;}
  9.   
  10. *Zeigt im Allgemeinen Ungenauigkeiten oder Korrekturen an*
  11. s {Textdekoration: durchgestrichen;}
  12.   
  13. *Kennzeichnet im Allgemeinen wichtigen Text*
  14. stark {font-weight: bolder;}
  15.   
  16. *Bedeutet im Allgemeinen, den Text zu unterstreichen*
  17. u {Textdekoration: Unterstreichung;}
  18.   
  19. *Bedeutet im Allgemeinen das Hinzufügen von Inhalten in kleiner Schriftart*
  20. klein {Schriftgröße: klein;}
  21.   
  22. *Bedeutet im Allgemeinen das Hinzufügen von hochgestellten und tiefgestellten Zeichen*
  23. sup {vertical-align: sub; Schriftgröße: kleiner;}
  24. sub {vertical-align: super; Schriftgröße: kleiner;}

2. Sprachelemente nutzen

Ruby-, RT- und RP-Elemente. Sehen wir uns zuerst die Auswirkungen an:

Entsprechender Code:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < p   Stil = " Schriftgröße: 3em;" >   
  2.      < ruby ​​>< rp > ( </ rp > < rt > chī </ rt > < rp > ) </ rp > </ ruby ​​​​>   
  3.      < ruby ​​> Hinterteil < rp > ( </ rp > < rt > Hauptteil </ rt > < rp > ) </ rp > </ ruby ​​​​>   
  4.      < ruby ​​>< rp > ( </ rp > < rt > wǎng </ rt > < rp > ) </ rp > </ ruby ​​​​>   
  5.      < ruby ​​>< rp > ( </ rp > < rt > liǎng </ rt > < rp > ) </ rp > </ ruby ​​​​>   
  6. </ p >   

3. Verwenden Sie vorformatierte Inhalte

Das Pre-Element kann die Art und Weise ändern, wie der Browser mit dem Inhalt umgeht, indem es das Ausblenden von Leerzeichen verhindert, sodass die Formatierung des Quelldokuments erhalten bleibt.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < vor >   
  2.      < Code >   
  3. var Früchte = ["Äpfel", "Orangen", "Mangos", "Kirschen"];
  4. für (var i = 0 ; i <   Früchte.Länge ; i++){
  5. document.writeln("Ich mag " + Früchte[i]);
  6. }
  7.      </ code >   
  8. </ vor >   

Die oben stehende ausführliche Erklärung zum Markieren von Text [HTML-Element] ist der gesamte Inhalt, den der Editor mit Ihnen teilt. Ich hoffe, dass er Ihnen als Referenz dienen kann. Ich hoffe auch, dass Sie 123WORDPRESS.COM unterstützen werden.

Original-URL: http://www.cnblogs.com/luka/archive/2016/07/23/5532134.html

<<:  Im Vorstellungsgespräch wurde ich gefragt, ob select...for update die Tabelle oder die Zeile sperren würde.

>>:  Detaillierte Schritte zur Installation von ros2 in Docker

Artikel empfehlen

Implementierung des Aufbaus eines Kubernetes-Clusters mit VirtualBox+Ubuntu16

Inhaltsverzeichnis Über Kubernetes Grundlegende U...

Tipps zur Optimierung von CSS-Schattenanimationen

Diese Technik stammt aus diesem Artikel - So anim...

JS realisiert den Effekt des Bildwasserfallflusses

In diesem Artikel wird der spezifische JS-Code zu...

So sichern Sie MySQL-Kontoinformationen elegant

Vorwort: Ich bin kürzlich auf das Problem der Ins...

Mysql-Timeline-Daten, um die ersten drei Daten desselben Tages zu erhalten

Erstellen von Tabellendaten CREATE TABLE `praise_...

Mysql Master-Slave-Synchronisation Last_IO_Errno:1236 Fehlerlösung

Was ist der Grund für den Fehler Last_IO_Errno:12...

Vergleich von CSS-Schatteneffekten: Schlagschatten und Box-Schatten

Drop-Shadow und Box-Shadow sind beide CSS-Eigensc...

Details zur Vue-Vorlagenkompilierung

Inhaltsverzeichnis 1. analysieren 1.1 Regeln für ...

Beispielcode zur einfachen Implementierung des Seitenlayouts mit Flex-Layout

Kommen wir ohne weitere Umschweife direkt zum Cod...

MySQL 5.7.18 Installer Installation Download Grafik-Tutorial

Dieser Artikel enthält das ausführliche Installat...

MySQL-Datenbank-Grundlagen SQL-Fensterfunktion Beispielanalyse-Tutorial

Inhaltsverzeichnis Einführung Einführung Aggregat...