Sura 1 Artworks

Acrylmalerei, Mischtechniken, Webdesign

XHTML-Elemente: Physische Auszeichnung

Posted by sura1 - 21. August 2008

Bookmark and Share

PHYSISCHE AUSZEICHNUNG:

Erklärung zu den Beispielen:

Klicken Sie bitte auf den Link BESCHREIBUNG und Sie erhalten eine ausführliche Erläuterung des betreffenden XHTML-Elementes (entnommen aus http://de.selfhtml.org/ ).

Für jedes Element stelle ich Ihnen ein von mir gestaltetes Beispiel vor (mit Quell-Text und Browser-Ansicht). Zusätzlich finden Sie unter WEITERE BEISPIELE je einen Link auf die englischsprachigen XHTML-Tutorials der Webseiten http://htmlplayground.com/ und
http://www.w3schools.com/

<b> </b>

Fettgedruckter Text ( Beschreibung )

Mit dem <b>-Element wird der eingegebene Textabschnitt als fettgedruckt dargestellt

Beispiel:

Quellcode:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <title>b-Element: Definition fettgedruckter Text</title>
</head>

<body>
<h1>Definition fettgedruckter Text</h1>
<p>Das ist ein normaler Text und <b>das ist ein fettgedruckter Text</b>.</p>
</body>

</html>

Beispiel: ( hier ansehen!)

weitere Beispiele

http://www.w3schools.com/tags/tag_font_style.asp
http://htmlplayground.com/#tag_b


<big> </big>

Text größer als normal dargestellt ( Beschreibung )

Mit dem <big>-Element wird der eingegebene Textabschnitt in einer größeren Schriftart als normal dargestellt.

Beispiel:

Quellcode:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <title>big-Element: Definition größerer Text</title>
</head>

<body>
<h1>Definition größerer Text</h1>
<p>Das ist ein normaler Textabschnitt;</p>
<p><big>Hier sehen Sie einen Text mit dem big-Element ausgezeichnet.</big></p>
</body>

</html>

Beispiel: ( hier ansehen!)

weitere Beispiele

http://www.w3schools.com/tags/tag_font_style.asp
http://htmlplayground.com/#tag_big


<i> </i>

Kursiver Text ( Beschreibung )

Mit dem <i>-Element wird der eingegebene Textabschnitt kursiv dargestellt.

Beispiel:

Quellcode:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <title>i-Element: Defintion kursiver Text</title>
</head>

<body>
<h1>Definition kursiver Text (italic)</h1>
<p>Dies ist ein normaler Textabschnitt;</p>
<p><i>Dieser Textabschnitt wird kursiv dargestellt!</i></p>
</body>

</html>

Beispiel: ( hier ansehen!)

weitere Beispiele

http://www.w3schools.com/tags/tag_font_style.asp
http://htmlplayground.com/#tag_i


<small> </small>

Text kleiner als normal dargestellt ( Beschreibung )

Mit dem <small>-Element wird der eingegebene Textabschnitt in einer kleineren Schriftart dargestellt.

Beispiel:

Quellcode:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <title>small-Element: Definition kleinere Schriftart</title>
</head>

<body>
<h1>Definition kleinere Schriftart</h1>
<p>Dies ist ein normaler Textabschnitt;</p>
<p><small>Dieser Textabschnitt wird in einer kleineren Schrift dargestellt!</small></p>
</body>

</html>

Beispiel: ( hier ansehen!)

weitere Beispiele

http://www.w3schools.com/tags/tag_font_style.asp
http://htmlplayground.com/#tag_small


<sub> </sub>

Tiefergestellter Text ( Beschreibung )

Mit dem <sub>-Element wird der eingegebene Textabschnitt tiefergestellt ( z.B. für Formeln, Fußnoten etc.) dargestellt.

Beispiel:

Quellcode:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <title>sub-Element: Definition tiefergestellter Text</title>
</head>

<body>
<h1>Definition: tiefergestellter Text</h1>
<p>Das ist ein normaler Textabschnitt;</p>
<p>Hier wird <sub>ein Teil des Textes</sub> tiefergestellt dargestellt.</p>
</body>

</html>

Beispiel: ( hier ansehen!)

weitere Beispiele

http://www.w3schools.com/tags/tag_sub.asp
http://htmlplayground.com/#tag_sub


<sup> </sup>

Höhergestellter Text ( Beschreibung )

Mit dem <sup>-Element wird der eingegebene Textabschnitt höhergestellt (z.B. für Formeln, Fußnoten etc.) dargestellt.

Beispiel:

Quellcode:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <title>sup-Element: Definition höhergestellter Text</title>
</head>

<body>
<h1>Definition höhergestellter Text</h1>
<p>Das ist ein normaler Textabschnitt</p>
<p>Hier wird <sup>ein Teil des Textes</sup> höhergestellt dargestellt.</p>
</body>

</html>

Beispiel: ( hier ansehen!)

weitere Beispiele

http://www.w3schools.com/tags/tag_sup.asp
http://htmlplayground.com/#tag_sup


<tt> </tt>

Text in Schreibmaschinenschrift ( Beschreibung )

Mit dem <tt>-Element wird der eingegebene Textabschnitt in Schreibmaschinenschrift dargestellt.

Beispiel:

Quellcode:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <title>tt-Element: Definition Text in Schreibmaschinenschrift</title>
</head>

<body>
<h1>Definition Text in Schreibmaschinenschrift (teletype)</h1>
<p>Das ist ein normaler Textabschnitt;</p>
<p><tt>Dieser Text wurde mit dem tt-Element ausgezeichnet und wird<br />
in Schreibmaschinenschrift dargestellt.</tt></p>
</body>

</html>

Beispiel: ( hier ansehen!)

weitere Beispiele

http://www.w3schools.com/tags/tag_font_style.asp
http://htmlplayground.com/#tag_tt

Schreibe einen Kommentar

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s

 
%d Bloggern gefällt das: