Einfaches Beispiel für HTML-Textformatierung (ausführliche Erklärung)

Einfaches Beispiel für HTML-Textformatierung (ausführliche Erklärung)

1. Textformatierung: Dieses Beispiel zeigt, wie Text in einer HTML-Datei formatiert wird.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < html >   
  2.   
  3. < Textkörper >   
  4.   
  5. < b > Dieser Text ist fett </ b >   
  6.   
  7. < br   />   
  8.   
  9. < strong > Dieser Text ist stark </ strong >   
  10.   
  11. < br   />   
  12.   
  13. < big > Dieser Text ist groß </ big >   
  14.   
  15. < br   />   
  16.   
  17. < em > Dieser Text ist hervorgehoben </ em >   
  18.   
  19. < br   />   
  20.   
  21. < i > Dieser Text ist kursiv </ i >   
  22.   
  23. < br   />   
  24.   
  25. < small > Dieser Text ist klein </ small >   
  26.   
  27. < br   />   
  28.   
  29. Dieser Text enthält
  30. <sub> Index </sub>​​​​   
  31.   
  32. < br   />   
  33.   
  34. Dieser Text enthält
  35. < sup > hochgestellt </ sup >   
  36.   
  37. </ Körper >   
  38. </ html >   

Die Wirkung ist wie folgt:

2. Vorformatierter Text: Dieses Beispiel zeigt, wie das Pre-Tag zur Steuerung von Leerzeilen und Leerzeichen verwendet wird.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < html >   
  2.   
  3. < Textkörper >   
  4.   
  5. < vor >   
  6. Das ist
  7. Vorformatierter Text.
  8. Es bewahrt Räume
  9. und Zeilenumbrüche.
  10. </ vor >   
  11.   
  12. Das < p > -Pre-Tag eignet sich hervorragend zum Anzeigen von Computercode: </ p >   
  13.   
  14. < vor >   
  15. für i = 1 bis 10
  16. drucken
  17. als nächstes ich
  18. </ vor >   
  19.   
  20. </ Körper >   
  21. </ html >   

Die Wirkung ist wie folgt:

3. Beschriftung „Computerausgabe“: Dieses Beispiel demonstriert die Anzeigeeffekte verschiedener Beschriftungen „Computerausgabe“.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < html >   
  2.   
  3. < Textkörper >   
  4.   
  5. <code> Computercode </code>​​​​   
  6. < br   />   
  7. < kbd > Tastatureingabe </ kbd >   
  8. < br   />   
  9. < tt > Fernschreibertext </ tt >   
  10. < br   />   
  11. < samp > Beispieltext </ samp >   
  12. < br   />   
  13. < var > Computervariable </ var >   
  14. < br   />   
  15.   
  16. < p >   
  17. < b > Kommentar: </ b > Diese Tags werden häufig verwendet, um Computer-/Programmcode anzuzeigen.
  18. </ p >   
  19.   
  20. </ Körper >   
  21. </ html >   

Die Wirkung ist wie folgt:

4. Adresse: Dieses Beispiel zeigt, wie eine Adresse in eine HTML-Datei geschrieben wird.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <!DOCTYPE html >   
  2. < html >   
  3. < Textkörper >   
  4.   
  5. <Adresse>​​   
  6. Geschrieben von < a   href = "mailto:[email protected]" > Donald Duck </ a > . < br >     
  7. Besuchen Sie uns auf: < br >   
  8. Beispiel.com < br >   
  9. Postfach 564, Disneyland < br >   
  10. USA
  11. </ Adresse >   
  12.   
  13. </ Körper >   
  14. </ html >   

Die Wirkung ist wie folgt:

5. Abkürzungen und Akronyme: Dieses Beispiel zeigt, wie Abkürzungen oder Akronyme implementiert werden.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < html >   
  2.   
  3. < Textkörper >   
  4.   
  5. < Abk.   Titel = "usw." > usw. </ abbr >   
  6. < br   />   
  7. < Akronym   Titel = "World Wide Web" > WWW </ Akronym >   
  8.   
  9. < p > In einigen Browsern kann der Titel verwendet werden, um die vollständige Version des Ausdrucks anzuzeigen, wenn Sie mit der Maus über die Abkürzung fahren. </ p >   
  10.   
  11. <p> Funktioniert in IE 5 nur mit Akronym-Elementen . </ p >   
  12.   
  13. < p > Gilt sowohl für die abbr- als auch für die acronym-Elemente in Netscape 6.2. </ p >   
  14.   
  15. </ Körper >   
  16. </ html >   

Die Wirkung ist wie folgt:

6. Textrichtung: Dieses Beispiel zeigt, wie die Textrichtung geändert wird.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < html >   
  2.   
  3. < Textkörper >   
  4.   
  5. < p >   
  6. Wenn Ihr Browser bidirektionales Override (bdo) unterstützt, wird die nächste Zeile von rechts nach links (rtl) ausgegeben.
  7. </ p >   
  8.   
  9. < bdo   dir = "rtl" >   
  10. Hier ist ein hebräischer Text
  11. </ bdo >   
  12.   
  13. </ Körper >   
  14. </ html >   

Die Wirkung ist wie folgt:

7. Blockzitate: Dieses Beispiel zeigt, wie Sie Zitate unterschiedlicher Länge umsetzen können.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < html >   
  2.   
  3. < Textkörper >   
  4.   
  5. Hier das lange Zitat:
  6. < blockquote >   
  7. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat. Dies ist ein langes Zitat.
  8. </ blockquote >   
  9.   
  10. Hier das kurze Zitat:
  11. < q >   
  12. Dies ist ein kurzes Zitat.
  13. </ q >   
  14.   
  15. < p >   
  16. Bei Verwendung des Blockquote-Elements fügt der Browser Zeilenumbrüche und Ränder ein, während das q-Element keine spezielle Darstellung aufweist.
  17. </ p >   
  18.   
  19. </ Körper >   
  20. </ html >   

Die Wirkung ist wie folgt:

8. Untereffekte löschen und Untereffekte einfügen.

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < html >   
  2.   
  3. < Textkörper >   
  4.   
  5. < p > Es gibt < del > zwanzig </ del > in einem Dutzend   <ins> zwölf </ins> Stücke .​​​ </ p >   
  6.   
  7. < p > Die meisten Browser schreiben dies so um, dass der Text durchgestrichen und unterstrichen wird. </ p >   
  8.   
  9. < p > Einige ältere Browser zeigen durchgestrichenen und unterstrichenen Text als normalen Text an. </ p >   
  10.   
  11. </ Körper >   
  12. </ html >   

Die Wirkung ist wie folgt:

Das obige einfache Beispiel für die HTML-Textformatierung (ausführliche Erklärung) ist der gesamte Inhalt, den der Editor mit Ihnen teilt. Ich hoffe, es kann Ihnen als Referenz dienen. Ich hoffe auch, dass Sie 123WORDPRESS.COM unterstützen werden.

<<:  Einführung in die Apache-Bereitstellung von https in der Kryptografie

>>:  Drei Möglichkeiten zum Erstellen eines Graueffekts auf Website-Bildern

Artikel empfehlen

Lösung für Linux CentOS 6.5 ifconfig kann IP nicht abfragen

Kürzlich sagten einige Freunde, dass sie nach der...

Detaillierter Prozess zur Bereitstellung von MySQL mit Docker (allgemeine Anwendungen, die mit Docker bereitgestellt werden)

Ich habe es Ihnen bereits vorgestellt: Docker (Be...

Das Vue-Projekt realisiert das Zeichnen eines Wasserzeichens in einem bestimmten Bereich

In diesem Artikel erfahren Sie, wie Sie mit Vue e...

JavaScript imitiert den Taobao-Lupeneffekt

In diesem Artikel wird der spezifische Code für J...

Detaillierte Erklärung generischer Fälle in TypeScript

Definition von Generika // Anforderung 1: Generik...

Detaillierte Erklärung der Sperrstruktur in MySQL

Mysql unterstützt 3 Arten von Sperrstrukturen Spe...

Lösung für Verbindungsfehler beim MySQL-Server 5.5

Die Lösung für das Problem, dass MySQL keine Verb...

Webdesign-Tipps für Formular-Eingabefelder

1. Gestricheltes Feld, wenn die Abbrechen-Schaltfl...

Implementierung des Pycharm-Installationstutorials auf Ubuntu 18.04

Methode 1: Pycharm herunterladen und installieren...

VirtualBox CentOS7.7.1908 Python3.8 Build Scrapy-Entwicklungsumgebung [grafisches Tutorial]

Inhaltsverzeichnis Umfeld Installieren Sie CentOS...

Detaillierte Erläuterung der Nginx Reverse Proxy WebSocket-Konfiguration

Kürzlich habe ich bei der Arbeit an einem Projekt...

So implementieren Sie Funktions-Currying und -Decurrying in Javascript

Funktion Currying (schwarzes Fragezeichen)? ? ? C...

uniapp Beispielcode zur Implementierung der globalen Freigabe von WeChat-Miniprogrammen

Inhaltsverzeichnis Erstellen einer global freigeg...

Realisieren Sie die Breadcrumb-Funktion basierend auf den Matched-Daten des Vue-Routers

In diesem Artikel wird hauptsächlich die Breadcru...

Detaillierte Erklärung des Prinzips zum Erstellen von Tomcat in Eclipse

Beim Erstellen eines Tomcat-Servers auf einem lok...