Newsletter

  • Immer informiert über die neusten Trends, Webseiten und Tutorials! Einfach hier für den monatlichen Newsletter anmelden.
  •  Eintragen
  •  Austragen

Login

Umfrage

  • Haben Sie Interesse an Softwaretipps für Webmaster?
  •  
  • ja
  • nein
  •  


Linktipps

Anzeige

 

www.finanzcheck.de
» Startseite » HTML, CSS und JavaScript Tutorials

XHTML - Textauszeichnungen

Textauszeichnungen in XHTML

  1.  [...]
  2.  <body>
  3.  <p>Das hier ist der erste Inhalt unserer Seite.</p>
  4.  </body>
  5.  [...]

Das hier ist der erste Inhalt unserer Seite.
Der Inhalt wird mit dem Absatz-Tag <p>...</p> ausgezeichnet, das hat zur Folge, das ein längerer Text immer bis zum rechten Browserrand fließt und dort einen automatischen Zeilenumbruch macht. Wenn man einen manuellen Zeilenumbruch machen will nutzt man den <br />-Tag.
Er ist ein sogennanter "Standalone"-Tag, da er aus nur einem Tag besteht und nicht wie alle anderen Tags die wir schon kennen, aus einem einleitenden und einem schließenden Tag besteht.

Ein Beispiel für die beiden neuen Tags:

  1.  <?xml version="1.0" encoding="iso-8859-1"?>
  2.  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  3.  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
  4.  <head>
  5.  <title>Textauszeichnungen</title>
  6.  </head>
  7.  <body>
  8.  <p>Hier steht ein Text, dann kommt ein manueller Umbruch.<br />Danach geht der Absatz weiter.</p>
  9.  <p></body>
  10.  </html>

Wie man am Beispiel sieht erzeugen Absätze (p und div) einen Block, das bedutet, dass eine Zeile unter dem Absatz freigelassen wird. Manuelle Umbrüche hingegen springen in die direkt darunter liegende Zeile.


Überschriften

In HTML gibt es 6 verschiedene Überschriften, sie haben die Tags <h1>...</h1>, <h2>...</h2>, [...], <h6> ... </h6>.

Beispiel:

  1.  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2.  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
  3.  <head>
  4.  <title>Textauszeichnungen</title>
  5.  </head>
  6.  <body>
  7.  <h1>Ueberschrift Ordung 1</h1>
  8.  <h2>Ueberschrift Ordung 2</h2>
  9.  <h3>Ueberschrift Ordung 3</h3>
  10.  <h4>Ueberschrift Ordung 4</h4>
  11.  <h5>Ueberschrift Ordung 5</h5>
  12.  <h6>Ueberschrift Ordung 6</h6> 
  13.  <p>Hier steht ein Text, dann kommt ein manueller Umbruch.<br />Danach geht der Absatz weiter.</p>
  14.  <p></p>
  15.  </body>
  16.  </html>

Wie man hier sieht, erzeugen auch Überschriften (h1 - h6) einen Block.

Formatierungen

In älternen HTML Versionen gab es den <font>-Tag, der es ermöglichte Farbe, Größe und Schriftart eines Textes anzugeben. Diesen Tag gibt es aber in XHTML nicht mehr, da für Formatierungen nur noch die Zusatzsprache CSS zuständig ist, was durchaus sinnvoll ist.

In XHTML gibt es aber noch Tags für fette (<strong>), kursive(<i>) und unterstrichende(<u>) Texte:

Beispiel:

  1.  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2.  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
  3.  <head>
  4.  <title>Formatierungen</title>
  5.  </head>
  6.  <body>
  7.  <p>Ein <strong>fetter</strong> und <i>kuriver</i> <strong><i>Text</i></strong></p> 
  8.  </body>
  9.  </html>

Wie im Beispiel zu sehen ist kann man auch mehrere Tags zusammen verwenden, dass nennt man dann Verschachteln. Beim Verschachteln muß man darauf achten, dass man die Tags in der richtigen Reihenfolge wieder schließt:

Richtig: <strong><i>Text</i></strong>
Falsch: <strong><i>Text</strong></i>

Fragen? Probleme? Keine Antworten? Hilfe finden Sie im Webmaster Forum!

Diese Artikel könnten Sie auch interessieren:
XHTML - HTML allgemein
monatlich wechselnder Link mit JavaScript
Übersichlichere Formulare
XHTML - Grafiken


 
Anzeige