【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

JavaScript realisiert den Effekt der mobilen Modalbox

In diesem Artikelbeispiel wird der spezifische Ja...

Beispiel, wie man einen Div-Hintergrund transparent macht

Es gibt zwei gängige Möglichkeiten, den Div-Hinte...

So konfigurieren Sie die MySQL Master-Slave-Replikation unter Windows

Die MySQL Master-Slave-Replikation ermöglicht die...

Mit JS ein kleines Flugzeugkriegsspiel implementieren

In diesem Artikelbeispiel wird der spezifische JS...

Lösung für den ES-Speicherüberlauf beim Starten von Docker

Fügen Sie die Datei jvm.options zur Elasticsearch...

10 Tipps zur Verbesserung der Website-Benutzerfreundlichkeit

Ob Unternehmenswebsite, persönlicher Blog, Shoppi...

Implementierungsbeispiel für Scan-Code-Zahlung im Vue-Projekt (mit Demo)

Inhaltsverzeichnis Nachfragehintergrund Gedankena...

JavaScript-Objekte (Details)

Inhaltsverzeichnis JavaScript-Objekte 1. Definiti...