HTML-Lehrgang

Textformatierungen

Textformate HTML

Alle folgenden Befehle sind im Hauptext der Seite, also nach <body> und vor </body> zu verwenden.

Die Befehle lassen sich auch kombinieren.

Überschriften

  • Überschrift 1. Ordnung
  • Überschrift 2. Ordnung
  • Überschrift 3. Ordnung
  • Überschrift 4. Ordnung
  • Überschrift 5. Ordnung
  • Überschrift 6. Ordnung

<h1> Überschrift. </h1>
<h2> </h2>
<h3></h3>
<h4> </h4>
<h5> </h5>
<h6> </h6>

1. Ordnung

2. Ordnung

3. Ordnung

4. Ordnung

5. Ordnung
6. Ordnung

Absätze und deren Ausrichtung

 

<p>... Dies ist ein Text...</p>

<p align="left"> linksbündig</p>

<p align="center">zentriert</p>

<p align="rigth">rechtsbündig</p>

<p align="justify">Blocksatz</p>

... Dies ist ein Text...

linksbündig

zentriert

rechtsbündig

Blocksatz
Schriftgröße ( 1 bis 7) <font size="6">... Dies ist ein Text...</font>

... Dies ist ein Text...

Formatierter Text

Leerstellen und Zeilenumbrüche werden ohne Veränderung übernommen.

 

<pre> .... </pre>

 
         1.Quartal   2. Quartal
Socken      1893         1606 
Hemden       795          801 
Hosen        649          530
weitere Formatierungen <b>fett. </b>
<i>kursiv </i>
<u>unterstrichen </u>
<blink>blinkend </blink>(Netscape)
<s>durchgestrichen </s>
<big>große Schrift</big>
<small>kleine Schrift</small>
was<sub>tiefgestellt </sub>
was<sup> hochgestellt</sup>

fett
kursiv
unterstrichen
blinkend
durchgestrichen
große Schrift
kleine Schrift
wastiefgestellt

washochgestellt


Textfarben

Textfarben HTML
Auch hier gilt, dass die Textfarben mit css gestaltet werden können.

Es wird zwischen dateiweiten Textfarben und abschnittsweisen Farben unterschieden.

Farbcode (#rgb)

r = Rotwert, hexadezimal 00 bis FF
g = Grünwert, hexadezimal 00 bis FF
b = Blauwert, hexadezimal 00 bis FF

Dateiweite Farbe im body, wird nichts vereinbart ist die Farbe schwarz.
Abschnittsfarben werden im laufen Text vereinbart.

(Standardfarben)

<html>
<head>
<title>Lehrgang am CSM</title>
</head>
<body bgcolor="#CC3300" text="#66FF99">
... Lehrgang CSM...
Das <FONT COLOR="#66FF99"> Chemnitzer Schulmodell </FONT> vergibt alle Schulabschlüsse der sächsischen Mittelschule. Bis Klasse 7 werden Lernentwicklungsberichte erstellt ab Klasse 8 gibt es Zensuren. In den Klassen 5 bis 7 werden die Fächer Geografie, Biologie und Physik einheitlich in dem Fach Naturkunde unterrichtet. Die Mittelschule bietet ab der 7. Klasse das sprachliche und das technische Profil an.
</body>
</html>
 ... Lehrgang CSM...
Das Chemnitzer Schulmodell vergibt alle Schulabschlüsse der sächsischen Mittelschule. Bis Klasse 7 werden Lernentwicklungsberichte erstellt ab Klasse 8 gibt es Zensuren. In den Klassen 5 bis 7 werden die Fächer Geografie, Biologie und Physik einheitlich in dem Fach Naturkunde unterrichtet. Die Mittelschule bietet ab der 7. Klasse das sprachliche und das technische Profil an.


Farben-für den-Dateihintergrund

Hintergrundfarben HTML
Die in der Tabelle dargestellte Möglichkeit ist nur eine Variante.
Besser (?) geht es mit css.

Dateiweite Hintergrundfarbe

 

Hintergrundfarbe (#rgb)

r = Rotwert, hexadezimal 00 bis FF
g = Grünwert, hexadezimal 00 bis FF
b = Blauwert, hexadezimal 00 bis FF

 

(Standardfarben)

<html>
<head>
<title>Lehrgang am CSM</title>
</head>
<body bgcolor="#CC3300">
... Lehrgang CSM...
</body>
</html>
 ... Lehrgang CSM...


Farbwirkungen

Die Wirkung von Farben

 

 

F

 

 

 

 

 

 

 

 

 

 

G

 

 

A

 

 

 

 

 

 

 

 

N

 

 

 

 

R

 

 

 

 

 

 

U

 

 

 

 

 

 

B

 

 

 

 

K

 

 

 

 

 

 

 

 

W

 

 

R

 

 

 

 

 

 

 

 

 

 

I

 

 

 

 

 

 

 

 

 

 

W

 

 

R

 

 

 

 

 

 

 

 

B

 

 

 

 

K

 

 

 

 

 

 

R

 

 

 

 

 

 

U

 

 

 

 

A

 

 

 

 

 

 

 

 

N

 

 

F

 

 

 

 

 

 

 

 

 

 

G

 

Randfarbe: CCCC99   Innenfarbe: FFFFCC
Allein mit den 216 Standardfarben ergeben sich 46656 Möglichkeiten

Selber die Farbwirkungen testen

bildeinbinden

BILD
Ein sehr kreatives Bild
Der Quelltext dazu:
<html>
<head>
<title>Bilder</title>
</head>
<body>
<img src="/bild.jpg" alt="BILD" height="100" width="200" title="tolles Bild">
<br>Ein sehr kreatives Bild
</body>
</html>

Schutz mit .htaccess

Schutz von Verzeichnissen mit .htaccess und .htusers

Komplette Beschreibung: http://de.selfhtml.org/servercgi/server/htaccess.htm#verzeichnisschutz"
Kurzform:
Um ein Verzeichnis (Ordner) und alle darin liegenden Verzeichnisse vor unerlaubten Blicken zu schützen gibt es viele Möglichkeiten. Eine der verbreitesten und auch sehr sichersten Methoden ist die Verwendung der zwei Dateien .htaccess und .htusers.
Die .htaccess kommt in das zu schützende Verzeichnis und sieht so aus:

AuthType Basic
AuthName "Lehrgangstester"
AuthUserFile /home/www/htdocs/schulmodell.eu/pfad/..../.htusers
require user thomas tester xxx

Anmerkungen:
1. Zeile muss so bleiben
2. Zeile Lehrgangstester kann durch jedes beliebige Wort ersetzt werden " " nicht vergessen
3. Zeile gibt an, wo die Datei der mit den Berechtigten zu finden sein soll, muss nicht im zu schützenden Verzeichnis sein
4. Zeile hier sind als Beispiel 3 Benutzernamen festgelegt, die in das Verzeichnis dürfen (genaue Schreibweise wichtig)
Die .htusers kommt in das Verzeichnis, welches bei .htaccess angeben ist, also auf der Homepage im Verzeichnis pfad/.../ und sieht so aus:

thomas:1$EtiFUow04UY
tester:1$EtiFUow04UY
xxx:1$EtiFUow04UY

Anmerkungen:
Jeder der Nutzer kann ein anderes Passwort haben.
qa0stHZ3cUX.I steht für das Passwort geheim. Das Passwort steht also nicht im Klartext in der Datei, sondern ist mit einem Script erzeugt worden.
ein Script bei Selfhtml
Anmerkungen: Wird bei dem Selfhtml-Script das Wort geheim durch das selber gewählte ersetzt und neu geladen, dann hat man das, was man braucht. Das Selfhtml-Script erzeugt bei wiederholtem Aufruf verschiedene Varianten für das gleiche Passwort.

--> eigenes script <--

Länderkennungen

Länderkennungen

AD --> Andorra
AE --> Vereinigte Arabische Emirate
AF --> Afghanistan
AG --> Antigua
AI --> Anguilla
AL --> Albanien
AM --> Armenien
AN --> Niederländische Antillen
AO --> Angola
AQ --> Antarktis
AR --> Argentinien
AS --> Samoa
AT --> Österreich
AU --> Australien
AW --> Aruba
AZ --> Aserbaidjan
BA --> Bosnien-Herzegovina
BB --> Barbados
BD --> Bangladesch
BE --> Belgien
BF --> Burkina Faso
BG --> Bulgarien
BH --> Bahrain
BI --> Burundi
BJ --> Benin
BM --> Bermuda
BN --> Brunei Darussalam
BO --> Bolivien
BR --> Brazilien
BS --> Bahamas
BT --> Bhutan
BV --> Bouvet Inseln
BW --> Botswana
BY --> Belarus
BZ --> Belize
CA --> Kanada
CC --> Kokos Inseln
CF --> Central Afrikanische Republik
CG --> Kongo
CH --> Schweiz
CI --> Elfenbeinküste
CK --> Cook Inseln
CL --> Chile
CM --> Kamerun
CN --> China
CO --> Kolumbien
CR --> Costa Rica
CS --> Tschechoslovakei
CU --> Kuba
CV --> Kapverdische Inseln
CX --> Weihnachts-Inseln
CY --> Zypern
CZ --> Tschechische Republik
DE --> Deutschland
DJ --> Djibouti
DK --> Dänemark
DO --> Dominikanische Republik
DZ --> Algerien
EC --> Ekuador
EE --> Estland
EG --> Ägypten
EH --> West Sahara
ER --> Eritrea
ES --> Spanien
ET --> Äthiopien
FI --> Finnland
FJ --> Fiji Inseln
FK --> Falkland Inseln
FM --> Mikronesien
FO --> Farör Inseln
FR --> Frankreich
GA --> Gabun
GB --> Großbritannien (meist UK)
GD --> Grenada
GE --> Georgien
GF --> Guyana
GH --> Ghana
GI --> Gibraltar
GL --> Grönland
GM --> Gambia
GN --> Guinea
GP --> Guadeloupe
GQ --> Äquatorial Guinea
GR --> Griechenland
GS --> Süd Georgia und Sandwich Inseln
GT --> Guatemala
GU --> Guam
GW --> Guinea Bissau
GY --> Guyana
HK --> Hongkong
HM --> Heard & McDonald Inseln
HN --> Honduras
HR --> Kroatien
HT --> Haiti
HU --> Ungarn
ID --> Indonesien
IE --> Irland
IL --> Israel
IN --> Indien
IO --> British Indien
IQ --> Irak
IR --> Iran
IS --> Island
IT --> Italien
JM --> Jamaika
JO --> Jordanien
JP --> Japan
KE --> Kenya
KG --> Kirgisische Republik
KH --> Kambodscha
KI --> Kiribati
KM --> Komoroen
KN --> St.Kitts Nevis Anguill
KP --> Nord-Korea
KR --> Süd-Korea
KW --> Kuwait
KY --> Cayman Inseln
KZ --> Kasachstan
LA --> Laos
LB --> Libanon
LC --> St. Lucia
LI --> Liechtenstein
LK --> Sri Lanka
LR --> Liberia
LS --> Lesotho
LT --> Lithuania
LU --> Luxemburg
LV --> Latvia
LY --> Libyen
MA --> Marokko
MC --> Monako
MD --> Moldavien
MG --> Madagascar
MH --> Marshall Inseln
MK --> Mazedonien
ML --> Mali
MM --> Myanmar
MN --> Mongolei
MO --> Macao
MP --> nördliche Marianen Inseln
MQ --> Martinique
MR --> Mauritanien
MS --> Montserrat
MT --> Malta
MU --> Mauritius
MV --> Maldiven
MW --> Malawi
MX --> Mexico
MY --> Malaysia
MZ --> Mozambique
NA --> Namibia
NC --> Neu Kaledonien
NE --> Niger
NF --> Norfolk Inseln
NG --> Nigeria
NI --> Nicaragua
NL --> Niederlande
NO --> Norwegen
NP --> Nepal
NR --> Nauru
NU --> Niue
NZ --> Neuseeland
OM --> Oman
PA --> Panama
PE --> Peru
PF --> Polynesien
PG --> Papua Neuguinea
PH --> Philippinen
PK --> Pakistan
PL --> Polen
PM --> St. Pierre & Miquelon
PN --> Pitcairn
PR --> Puerto Rico
PT --> Portugal
PW --> Palau
PY --> Paraguay
QA --> Qatar
RE --> Reunion
RO --> Rumänien
RU --> Russische Föderation
RW --> Ruanda
SA --> Saudi Arabien
SB --> Solomonen Inseln
SC --> Seychellen
SD --> Sudan
SE --> Schweden
SG --> Singapur
SH --> St. Helena
SI --> Slovenien
SJ --> Svalbard & Jan Mayen
SK --> Slovakische Republik
SL --> Sierra Leone
SM --> San Marino
SN --> Senegal
SO --> Somalia
SR --> Surinam
ST --> St. Tome and Principe
SV --> El Salvador
SY --> Syrien
SZ --> Swaziland
TC --> Turks & Caicos Inseln
TD --> Tschad
TG --> Togo
TH --> Thailand
TJ --> Tadjikistan
TK --> Tokelau
TM --> Turkmenistan
TN --> Tunesien
TO --> Tonga
TP --> Ost Timor
TR --> Türkei
TT --> Trinidad & Tobago
TV --> Tuvalu
TW --> Taiwan
TZ --> Tansania
UA --> Ukraine
UG --> Uganda
UK --> United Kingdom (England)
US --> United States (USA)
UY --> Uruguay
UZ --> Uzbekistan
VA --> Vatikan
VC --> St.Vincent & Grenadine
VE --> Venezuela
VG --> Virgin Islands (britisch)
VI --> Virgin Islands (US)
VN --> Vietnam
VU --> Vanuatu
WF --> Wallis & Futuna Inseln
WS --> Samoa
YE --> Yemen
YT --> Mayotte
YU --> Jugoslavien
ZA --> Süd Afrika
ZM --> Zambia
ZR --> Zaire
ZW --> Zimbabwe
Domains, die nicht einem bestimmten Land zugeordnet sind (aber häufig in den USA zu finden sind):
ARPA --> alte Arpanet-Domain
COM --> kommerzielle
EDU --> Erziehung und Wissenschaft, i.a. amerikanische Universitäten
GOV --> Regierung
INT --> allgemein internationaler Bereich
MIL --> US-Militär
NATO --> Nato
NET --> Netzwerk-Anbieter
ORG --> Non-Profit Organisation
Relativ neu:
eu --> Europa
info --> zur allgemeinen Verwendung
biz --> Unternehmen
pro --> Anwälte, Steuerberater und Ärzte
name --> rivatpersonen in der Form: Vorname.Nachname.name
museum --> Museen
aero --> Fluggesellschaften, Flughäfen, Reiseveranstalter, usw.
coop --> genossenschaftliche Unternehmen und Organisationen
... kommen bestimmt noch mehr
Infos bei Wikipedia

 

Grundstruktur von Links

www.WIE_SETZE_ICH_LINKS.de

 

Text
 link
Linkzieltext
 Linkzieltext
Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein!
 Mail me

Listenarten

Listen

Grundsätzlich kann zwischen ungeordneten und geordneten Listen unterschieden werden:

ungeordnete Liste geordnete Liste
  • Dies ist eine ziemlich
  • ungeordnete Liste.
  1. Dies ist eine geordnete Liste.
  2. Die einzelnen Listenpunkte
  3. werden durchnummeriert.
Q U E L L C O D E
<ul>
<li> Dies ist eine ziemlich</li>
<li> ungeordnete Liste.</li>
</ul>		 <ol>
<li> Dies ist eine geordnete Liste.</li>
<li> Die einzelnen Listenpunkte</li>
<li> werden durchnummeriert.</li>
</ol>

Erläuterung :

  • Die ganze Liste wird innerhalb des <ul> </ul> - bzw. <ol> </ol> - Tags definiert (ul=unordered list , ol=ordered list).
  • jeder einzelne Listenpunkt wird innerhalb eines <li> </li> - Tags definiert (li=list item).

Im Folgenden wird noch auf die Darstellung der Listenpunkte eingegangen:

ungeordnete Listen

Die Gestalt der Listenpunkte lässt sich durch geeignete Attribute noch verändern. Dabei spielt vor allem das Attribut type= eine Rolle. Bei ungeordneten Listen sind neben dem voreingestellten Wert disc noch circle und square zugelassen.

  • [disc]
  • [circle]
  • [square]

Das type- Attribut lässt sich auf beide Tags (<ul> und <li>) anwenden:

Beispiel:

<ul type="circle">
<li> Eine Liste</li>
<li> mit type="circle" im <ul>- Tag .</li>
</ul>
<ul>
<li type="circle">Noch eine Liste .</li>
<li type="disc">Diesmal mit individuelleren</li>
<li type="square"> Bezeichnern.</li>
</ul>
ergibt:
  • Eine Liste
  • mit type="circle" im <ul>- Tag.
  • Noch eine Liste.
  • Diesmal mit individuelleren
  • Bezeichnern.

geordnete Listen

Auf geordnete Listen lässt sich ebenfalls das type - Attribut anwenden. Erlaubte Werte sind hier a, A , i und I.

a: Liste wird alphabetisch numeriert, mit Kleinbuchstaben.
A: Liste wird alphabetisch numeriert, mit Grossbuchstaben.
i & I: analog wie a und A, aber mit römischer Numerierung.

Beispiel:

<ol type=i>
<li>Eine Liste mit römischer Numerierung.</li>
<li> Zweiter Listenpunkt.</li>
</ol>
ergibt:
  1. Eine Liste mit römischer Numerierung.
  2. Zweiter Listenpunkt.

Mit dem Attribut start wird mit der Numerierung von einem bestimmten Punkt aus begonnen:

Beispiel :

<ol start=120>
<li>Erster Eintrag</li>
<li>Zweiter Eintrag</li>
</ol>
ergibt :
  1. Erster Eintrag
  2. Zweiter Eintrag

Liste in der Liste
  • erster Eintrag
  • zweiter Eintrag
    • dritter Eintrag
    • vierter Eintag
  • fünfter Eintrag

Liste in der Liste
<ul>
<li>erster Eintrag</li>
<li>zweiter Eintrag</li>
<ul>
<li>dritter Eintrag</li>
<li>vierter Eintag</li>
</ul>
<li>fünfter Eintrag</li>
</ul>

Es gibt darüber hinaus die Möglichkeit eigene Bilder als Bullets zu verwenden

bullet.jpgerster Eintrag
bullet.jpgzweiter Eintrag
bullet.jpgdritter Eintrag

Quelltext:

<dl>
<dd><img src="/bilder/bullet.jpg" alt="bullet.jpg" hspace="10">erster Eintrag</dd>
<dd><img src="/bilder/bullet.jpg" alt="bullet.jpg" hspace="10">zweiter Eintrag</dd>
<dd><img src="/bilder/bullet.jpg" alt="bullet.jpg" hspace="10">dritter Eintrag</dd>
</dl>

komplexe Tabellen

Komplextabelle

 

Hallo,

hier

ist

eine

sehr

komplexe

Tabelle

beschrieben.

Sie

besteht

aus

verbundenen

Spalten

und

Zeilen.

Im

Quelltext

wird

ersichtlich,

wie

das

gemacht

worden

ist.

Durch

die Verwendung

als

unsichtbare

Tabelle

lassen

sich

so

entsprechende

Anordnungen

„leicht“

erzielen.

 

Komplextabelle

 

Hallo,

hier

ist

eine

sehr

komplexe

Tabelle

beschrieben.

Sie

besteht

aus

verbundenen

Spalten

und

Zeilen.

Im

Quelltext

wird

ersichtlich,

wie

das

gemacht

worden

ist.

Durch

die Verwendung

als

unsichtbare

Tabelle

lassen

sich

so

entsprechende

Anordnungen

„leicht“

erzielen.

 

Komplextabelle

 

	



























































												
			
				
Hallo,

								
				
hier

								
				
ist

								
				
eine

								
				
sehr

							
		
			
				
komplexe

								
				
Tabelle

								
				
beschrieben.

							
		
			
				
Sie 

								
				
besteht

								
				
aus

								
				
verbundenen

							
		
			
				
Spalten

								
				
und 

								
				
Zeilen.

								
				
Im 

								
				
Quelltext

							
		
			
				
wird

								
				
ersichtlich,

								
				
wie

								
				
das 

								
				
gemacht 

							
		
			
				
worden

								
				
ist.

								
				
Durch

								
				
die Verwendung

								
				
als

							
		
			
				
unsichtbare

								
				
Tabelle

								
				
lassen 

								
				
sich

							
		
			
				
so

								
				
entsprechende

								
				
Anordnungen

							
		
			
				
„leicht“

								
				
erzielen.





einfache Tabelle

Einfache Tabellen

Eine Tabelle besteht aus Zeilen und Spalten. Tabellen finden als unsichtbare Gestaltungselemente und als sichtbare Elemente zur Darstellungen von Übersichten Verwendung.

erste Tabelle

1. Zeile, 1. Spalte 1. Zeile, 2. Spalte 1. Zeile, 3. Spalte
2. Zeile, 1. Spalte 2. Zeile, 2. Spalte 2. Zeile, 3. Spalte

Quelltext

		











	
		1. Zeile, 1. Spalte		1. Zeile, 2. Spalte		1. Zeile, 3. Spalte	
	
		2. Zeile, 1. Spalte		2. Zeile, 2. Spalte		2. Zeile, 3. Spalte

Eine solche Tabelle wird immer so breit, wie es der Inhalt erfordert.

Durch das Hinzufügen von Eigenschaften lassen sich die Tabellenelemente verändern, die Eigenschaften wirken immer an der eingesetzten Stelle

Beispiele:

1. Zeile, 1. Spalte 1. Zeile, 2. Spalte 1. Zeile, 3. Spalte
2. Zeile, 1. Spalte 2. Zeile, 2. Spalte 2. Zeile, 3. Spalte 
		











	
		1. Zeile, 1. Spalte		1. Zeile, 2. Spalte		1. Zeile, 3. Spalte	
	
		2. Zeile, 1. Spalte		2. Zeile, 2. Spalte		2. Zeile, 3. Spalte

Farbtabellen

Übersicht der Farbnamen der ersten 16 Standardfarben

black Diese Farbe maroon Diese Farbe
green Diese Farbe olive Diese Farbe
navy Diese Farbe purple Diese Farbe
teal Diese Farbe gray Diese Farbe
silver Diese Farbe red Diese Farbe
lime Diese Farbe yellow Diese Farbe
blue Diese Farbe fuchsia Diese Farbe
aqua Diese Farbe white Diese Farbe

 

Alle 216 HTML-Standardfarben

 

000000 000033 000066 000099 0000CC 0000FF
003300 003333 003366 003399 0033CC 0033FF
006600 006633 006666 006699 0066CC 0066FF
009900 009933 009966 009999 0099CC 0099FF
00CC00 00CC33 00CC66 00CC99 00CCCC 00CCFF
00FF00 00FF33 00FF66 00FF99 00FFCC 00FFFF
330000 330033 330066 330099 3300CC 3300FF
333300 333333 333366 333399 3333CC 3333FF
336600 336633 336666 336699 3366CC 3366FF
339900 339933 339966 339999 3399CC 3399FF
33CC00 33CC33 33CC66 33CC99 33CCCC 33CCFF
33FF00 33FF33 33FF66 33FF99 33FFCC 33FFFF
660000 660033 660066 660099 6600CC 6600FF
663300 663333 663366 663399 6633CC 6633FF
666600 666633 666666 666699 6666CC 6666FF
669900 669933 669966 669999 6699CC 6699FF
66CC00 66CC33 66CC66 66CC99 66CCCC 66CCFF
66FF00 66FF33 66FF66 66FF99 66FFCC 66FFFF
990000 990033 990066 990099 9900CC 9900FF
993300 993333 993366 993399 9933CC 9933FF
996600 996633 996666 996699 9966CC 9966FF
999900 999933 999966 999999 9999CC 9999FF
99CC00 99CC33 99CC66 99CC99 99CCCC 99CCFF
99FF00 99FF33 99FF66 99FF99 99FFCC 99FFFF
CC0000 CC0033 CC0066 CC0099 CC00CC CC00FF
CC3300 CC3333 CC3366 CC3399 CC33CC CC33FF
CC6600 CC6633 CC6666 CC6699 CC66CC CC66FF
CC9900 CC9933 CC9966 CC9999 CC99CC CC99FF
CCCC00 CCCC33 CCCC66 CCCC99 CCCCCC CCCCFF
CCFF00 CCFF33 CCFF66 CCFF99 CCFFCC CCFFFF
FF0000 FF0033 FF0066 FF0099 FF00CC FF00FF
FF3300 FF3333 FF3366 FF3399 FF33CC FF33FF
FF6600 FF6633 FF6666 FF6699 FF66CC FF66FF
FF9900 FF9933 FF9966 FF9999 FF99CC FF99FF
FFCC00 FFCC33 FFCC66 FFCC99 FFCCCC FFCCFF
FFFF00 FFFF33 FFFF66 FFFF99 FFFFCC FFFFFF


hallo

Hallo CSM

Um eine Seite zu erzeugen, die dir
Hallo CSM
anzeigt, musst du folgenden Quelltext einfach mit einem einfachen Editor (Notepad, Texteditor, kedit, gedit, ... ) schreiben und als hallo.htm abspeichern. Anschließend kannst du die Seite mit einem Browser ( Netscape, Internetexplorer, Opera, Mozilla, ...) anschauen. Achte auf die genaue Schreibweise. Viel Spaß
<HTML>
<HEAD>
<TITLE> erster Versuch</TITLE>
</HEAD>
<BODY>
Hallo CSM
</BODY>
</HTML>

 

Je nach Dokumententyp kann auch die Kleinschreibung der Befehle günstig sein.

HTML-Sonderzeichen

Zeichensätze, Sonderzeichen und Umlaute in HTML-Dokumenten

Der wichtigste Zeichensatz des Internets ist Ascii-Code
Dieser umfasst 7 Bit, also 128 Zeichen. So wird die Zahl 65 dem Buchstaben A zugeordnet. Große und kleine Buchbstaben unterscheiden sich um 32 Stellen und damit an nur einer Stelle in der Byte-Darstellung.
Erweiterte Codes waren meißt nur national gültig.
Da ein Byte(= 8 Bit) aber 256 Zeichen umfasst bleiben 128 Möglichkeiten offen.
Mit ISO 8859 gibt es nun einen standardisierten Zeichensatz, der die freien oberen 128 Zeichen für die Sonderzeichen der verschiedenen Kulturen nutzt.

Der (moderne) Server prüft anhand der ersten paar Bytes eines Dokuments, welche Zeichenkodierung gilt und benachrichtigt das Benutzerprogramm - den Browser - durch den "Charset"-Parameter im Content-Type-Header des HTTP-Protokolls. Da aber manche Server nicht gestatten, einen Charset-Parameter zu senden oder nicht entsprechend konfiguriert sind, bietet HTML seit Version 4 die Möglichkeit, den Zeichensatz durch die Angabe von

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

(Western ISO Latin 1) im Kopf des Dokuments zu definieren.

Wird dieser Zusatz in den Header geschrieben, so müssen die folgenden Buchstaben nicht mit Umschrift geschrieben werden:
"ä, Ä, ö, Ö, ü, Ü, ß, ©, è, à".

Hinweis: Mehr Sonderzeichen – insbesondere das €-Teichen – verlangen die Angabe
<meta http-equiv="content-type" content="text/html; charset=iso-8859-15">
im Header.
Auf der sicheren Seite ist man mit dem Unicode, durch die Angabe von
<meta http-equiv="content-type" content="text/html; charset=utf-8" />.

Ein Wort zu älteren Browsern, diese reagieren besser, wenn die numerischen Codes benutzt werden. So stellt Netscape 4 z.B. das Aufzählungssymbol "•" korrekt dar, wenn es als
•
notiert ist. Wird der HTML-Name
•
verwendet, bringt Netscape 4 ein Fragezeichen oder ein leeres Rechteck.

Die Reihenfolge in der Tabelle ist nach dem Unicode gewählt.

Also so geht es nun:

  1. <meta http-equiv="content-type" content="text/html; charset=utf-8" /> im Header haben
  2. Unicode des Zeichens in Quelle 3 suchen.
  3. Unicode ist eine Hexadezimaldarstellung, also umrechnen, z.B.
    U+20AC steht für 2·16^3 + 0·16^2 + 10·16^1 + 12 = 8364
  4. Nun in den Quelltext ↺ schreiben und es erscheint €
  5. Umrechnung
Achtung beim Übertragen auf schulmodell.eu die "Namensbeschreibungen" verschwunden, das wird jetzt nach und nach ergänzt, sorry.
Zeichen Name Numerisch Beschreibung Unicode
" "     nicht brechendes Leerzeichen U+00A0
"¡" & iexcl; ¡ umgekehrtes Ausrufezeichen U+00A1
"¢" & cent; ¢ Cent U+00A2
"£" & pound; £ britisches Pfund U+00A3
"¤" ¤ ¤ generisches Währungszeichen U+00A4
"¥" ¥ ¥ japanischer Yen U+00A5
"¦" ¦ ¦ gebrochener senkrechter Strich U+00A6
"§" § § Paragraph, Absatzzeichen U+00A7
"¨" ¨ ¨ Umlaut mit Leerraum U+00A8
"©" © © Copyright U+00A9
"ª" ª ª weibliches Ordinal (Ordnungszahl) U+00AA
"«" « « typografisches Anführungszeichen nach links weisend = Guillemet nach links U+00AB
"¬" ¬ ¬ Negierung U+00AC
"­" ­ ­ weiches Trennzeichen U+00AD
"®" ® ® registrierte Handelsmarke U+00AE
"¯" ¯ ¯ Makron U+00AF
"°" ° ° Grad U+00B0
"±" ± ± Plusminus U+00B1
"²" ² ² hoch 2 = Quadrat U+00B2
"³" ³ ³ hoch 3 = Kubik U+00B3
"´" ´ ´ Akut mit Leerraum U+00B4
"µ" µ µ Mikro U+00B5
"¶" Absatzzeichen U+00B6
"·" · · Mittelpunkt U+00B7
"¸" ¸ ¸ Cedilla mit Leerraum U+00B8
"¹" ¹ ¹ hoch 1 U+00B9
"º" º º männliches Ordinal (Ordnungszahl) U+00BA
"»" » » typografisches Anführungszeichen nach rechts weisend = Guillemet nach rechts U+00BB
"¼" ¼ ¼ ein Viertel U+00BC
"½" ½ ½ ein Halb U+00BD
"¾" ¾ ¾ drei Viertel U+00BE
"¿" ¿ ¿ umgekehrtes Fragezeichen U+00BF
"À" À À großes lateinisches A mit Gravis U+00C0
"Á" Á Á großes lateinisches A mit Akut U+00C1
"Â" Â Â großes lateinisches A mit Zirkumflex U+00C2
"Ã" Ã Ã großes lateinisches A mit Tilde U+00C3
"Ä" Ä Ä Ä U+00C4
"Å" Å Å großes lateinisches A mit Ring U+00C5
"Æ" Æ Æ großes lateinisches AE = große lateinische Ligatur AE U+00C6
"Ç" Ç Ç großes lateinisches C mit Cedilla U+00C7
"È" È È großes lateinisches E mit Gravis U+00C8
"É" É É großes lateinisches E mit Akut U+00C9
"Ê" Ê Ê großes lateinisches E mit Zirkumflex U+00CA
"Ë" Ë Ë großes lateinisches E mit Diaeresis U+00CB
"Ì" Ì Ì großes lateinisches I mit Gravis U+00CC
"Í" Í Í großes lateinisches I mit Akut U+00CD
"Î" Î Î großes lateinisches I mit Zirkumflex U+00CE
"Ï" Ï Ï großes lateinisches I mit Umlaut U+00CF
"Ð" Ð Ð großes lateinisches ETH U+00D0
"Ñ" Ñ Ñ großes lateinisches N mit Tilde U+00D1
"Ò" Ò Ò großes lateinisches O mit Gravis U+00D2
"Ó" Ó Ó großes lateinisches O mit Akut U+00D3
"Ô" Ô Ô großes lateinisches O mit Zirkumflex U+00D4
"Õ" Õ Õ großes lateinisches O mit Tilde U+00D5
"Ö" Ö Ö Ö U+00D6
"×" × × Multiplikationszeichen U+00D7
"Ø" Ø Ø großes lateinisches O mit Querstrich U+00D8
"Ù" Ù Ù großes lateinisches U mit Gravis U+00D9
"Ú" Ú Ú großes lateinisches U mit Akut U+00DA
"Û" Û Û großes lateinisches U mit Zirkumflex U+00DB
"Ü" Ü Ü Ü U+00DC
"Ý" Ý Ý großes lateinisches Y mit Akut U+00DD
"Þ" Þ Þ großes lateinisches THORN U+00DE
"ß" ß ß kleines lateinisches ß = ess-zed U+00DF
"à" à à kleines lateinisches a mit Gravis U+00E0
"á" á á kleines lateinisches a mit Akut U+00E1
"â" â â kleines lateinisches a mit Zirkumflex U+00E2
"ã" ã ã kleines lateinisches a mit Tilde U+00E3
"ä" ä ä ä U+00E4
"å" å å kleines lateinisches a mit Ring = kleines lateinisches a Ring U+00E5
"æ" æ æ kleines lateinisches ae = kleine lateinische Ligatur ae U+00E6
"ç" ç ç kleines lateinisches c mit Cedilla U+00E7
"è" è è kleines lateinisches e mit Gravis U+00E8
"é" é é kleines lateinisches e mit Akut U+00E9
"ê" ê ê kleines lateinisches e mit Zirkumflex U+00EA
"ë" ë ë kleines lateinisches e mit Diaeresis U+00EB
"ì" ì ì kleines lateinisches i mit Gravis U+00EC
"í" í í kleines lateinisches i mit Akut U+00ED
"î" î î kleines lateinisches i mit Zirkumflex U+00EE
"ï" ï ï kleines lateinisches i mit Diaeresis U+00EF
"ð" ð ð kleines lateinisches Eth U+00F0
"ñ" ñ ñ kleines lateinisches n mit Tilde U+00F1
"ò" ò ò kleines lateinisches o mit Gravis U+00F2
"ó" ó ó kleines lateinisches o mit Akut U+00F3
"ô" ô ô kleines lateinisches o mit Zirkumflex U+00F4
"õ" õ õ kleines lateinisches o mit Tilde U+00F5
"ö" ö ö ö U+00F6
"÷" ÷ ÷ Divisionszeichen U+00F7
"ø" ø ø kleines lateinisches o mit Querstrich U+00F8
"ù" ù ù kleines lateinisches u mit grave U+00F9
"ú" ú ú kleines lateinisches u mit acute U+00FA
"û" û û kleines lateinisches u mit circumflex U+00FB
"ü" ü ü ü U+00FC
"ý" ý ý kleines lateinisches y mit Akut U+00FD
"þ" þ þ kleines lateinisches thorn U+00FE
"ÿ" ÿ ÿ kleines lateinisches y mit Diaeresis U+00FF
"ƒ" ƒ ƒ kleines lateinisches f mit Häkchen = Funktion = Florin U+0192
"Α" Α Α großes griechisches Alpha U+0391
"Β" Β Β großes griechisches Beta U+0392
"Γ" Γ Γ großes griechisches Gamma U+0393
"Δ" Δ Δ großes griechisches Delta U+0394
"Ε" Ε Ε großes griechisches Epsilon U+0395
"Ζ" Ζ Ζ großes griechisches Zeta U+0396
"Η" Η Η großes griechisches Eta U+0397
"Θ" Θ Θ großes griechisches Theta U+0398
"Ι" Ι Ι großes griechisches Iota U+0399
"Κ" Κ Κ großes griechisches Kappa U+039A
"Λ" Λ Λ großes griechisches Lambda U+039B
"Μ" Μ Μ großes griechisches Mu U+039C
"Ν" Ν Ν großes griechisches Nu U+039D
"Ξ" Ξ Ξ großes griechisches Xi U+039E
"Ο" Ο Ο großes griechisches Omicron U+039F
"Π" Π Π großes griechisches Pi U+03A0
"Ρ" Ρ Ρ großes griechisches Rho U+03A1
"Σ" Σ Σ großes griechisches Sigma U+03A3
"Τ" Τ Τ großes griechisches Tau U+03A4
"Υ" Υ Υ großes griechisches Ypsilon U+03A5
"Φ" Φ Φ großes griechisches Phi U+03A6
"Χ" Χ Χ großes griechisches Chi U+03A7
"Ψ" Ψ Ψ großes griechisches Psi U+03A8
"Ω" Ω Ω großes griechisches Omega U+03A9
"α" α α kleines griechisches alpha U+03B1
"β" β β kleines griechisches beta U+03B2
"γ" γ γ kleines griechisches gamma U+03B3
"δ" δ δ kleines griechisches delta U+03B4
"ε" ε ε kleines griechisches epsilon U+03B5
"ζ" ζ ζ kleines griechisches zeta U+03B6
"η" η η kleines griechisches eta U+03B7
"θ" θ θ kleines griechisches theta U+03B8
"ι" ι ι kleines griechisches iota U+03B9
"κ" κ κ kleines griechisches kappa U+03BA
"λ" λ λ kleines griechisches lambda U+03BB
"μ" μ μ kleines griechisches mu U+03BC
"ν" ν ν kleines griechisches nu U+03BD
"ξ" ξ ξ kleines griechisches xi U+03BE
"ο" ο ο kleines griechisches omicron U+03BF
"π" π π kleines griechisches pi U+03C0
"ρ" ρ ρ kleines griechisches rho U+03C1
"ς" ς ς kleines griechisches finales sigma U+03C2
"σ" σ σ kleines griechisches sigma U+03C3
"τ" τ τ kleines griechisches tau U+03C4
"υ" υ υ kleines griechisches ypsilon U+03C5
"φ" φ φ kleines griechisches phi U+03C6
"χ" χ χ kleines griechisches chi U+03C7
"ψ" ψ ψ kleines griechisches psi U+03C8
"ω" ω ω kleines griechisches omega U+03C9
"ϑ" ϑ ϑ kleines griechisches theta U+03D1
"ϒ" ϒ ϒ griechisches ypsilon mit hook symbol U+03D2
"ϖ" ϖ ϖ griechisches pi U+03D6
"•" • • gefüllter Kreis (bullet) = Aufzählungssymbol U+2022
"…" … … Auslassungspunkte U+2026
"′" ′ ′ einfaches Anführungszeichen = Minuten = Fuss U+2032
"″" ″ ″ doppeltes Anführungszeichen = Sekunden = Inch U+2033
"‾" ‾ ‾ Überstreichung U+203E
"⁄" ⁄ ⁄ Bruchstrich U+2044
"℘" &weierpv ℘ großes P, dargestellt in einem Skriptfont = Weierstraß'sche P-Funktion U+2118
"ℑ" ℑ ℑ großes I Fraktur = imaginärer Anteil einer Zahl U+2111
"ℜ" ℜ ℜ großes R Fraktur = realer Anteil einer Zahl U+211C
"™" ™ ™ Handelsmarke U+2122
"ℵ" ℵ ℵ Alefsymbol = erste finite Ordnungszahl U+2135
"←" ← ← Pfeil nach links U+2190
"↑" ↑ ↑ Pfeil nach oben U+2191
"→" → → Pfeil nach rechts U+2192
"↓" ↓ ↓ Pfeil nach unten U+2193
"↔" ↔ ↔ Pfeil nach links und rechts U+2194
"↵" ↵ ↵ Pfeil nach unten mit Ecke nach links = carriage return = Zeilenumbruch U+21B5
"⇐" ⇐ ⇐ Doppelpfeil nach links U+21D0
"⇑" ⇑ ⇑ Doppelpfeil nach oben U+21D1
"⇒" ⇒ ⇒ Doppelpfeil nach rechts U+21D2
"⇓" ⇓ ⇓ Doppelpfeil nach unten U+21D3
"⇔" ⇔ ⇔ Doppelpfeil nach links und rechts U+21D4
"∀" ∀ ∀ für alle U+2200
"∂" ∂ ∂ partiales Differential U+2202
"∃" ∃ ∃ es gibt U+2203
"∅" ∅ ∅ leere Menge U+2205
"∇" ∇ ∇ Nablafunktion U+2207
"∈" ∈ ∈ Element von U+2208
"∉" ∉ ∉ kein Element von U+2209
"∋" ∋ ∋ enthält U+220B
"∏" ∏ ∏ Produktzeichen U+220F
"∑" ∑ ∑ Summenzeichen U+2211
"−" − − Minuszeichen U+2212
"∗" ∗ ∗ Stern-Operator U+2217
"√" √ √ Quadratwurzel U+221A
"∝" ∝ ∝ proportional zu U+221D
"∞" ∞ ∞ unendlich U+221E
"∠" ∠ ∠ Winkel U+2220
"∧" ∧ ∧ logisches Und U+2227
"∨" ∨ ∨ logisches Oder U+2228
"∩" ∩ ∩ Schnittmenge U+2229
"∪" ∪ ∪ Vereinigung U+222A
"∫" ∫ ∫ Integral U+222B
"∴" ∴ ∴ darum U+2234
"∼" ∼ ∼ Tilde-Operator = ähnlich wie U+223C
"≅" ≅ ≅ ungefähr gleich U+2245
"≈" ≈; ≈ fast gleich = asymptotisch zu U+2248
"≠" ≠ ≠ nicht gleich U+2260
"≡" ≡ ≡ identisch U+2261
"≤" ≤ ≤ weniger oder gleich U+2264
"≥" ≥ ≥ größer oder gleich U+2265
"⊂" ⊂ ⊂ Untermenge von U+2282
"⊃" ⊃ ⊃ Obermenge von U+2283
"⊄" ⊄ ⊄ Keine Untermenge von U+2284
"⊆" ⊆ ⊆ Untermenge oder gleich U+2286
"⊇" ⊇ ⊇ Obermenge oder gleich U+2287
"⊕" ⊕ ⊕ Pluszeichen im Kreis = direkte Summe U+2295
"⊗" ⊗ ⊗ Multiplikationszeichen im Kreis = Vektorprodukt U+2297
"⊥" ⊥ ⊥ senkrecht auf = orthogonal zu U+22A5
"⋅" ⋅ ⋅ Punktoperator U+22C5
"⌈" ⌈ ⌈ linke Ecke oben (Rahmen) U+2308
"⌉" ⌉ ⌉ rechte Ecke oben (Rahmen) U+2309
"⌊" ⌊ ⌊ linke Ecke unten (Rahmen) U+230A
"⌋" ⌋ ⌋ rechte Ecke oben (Rahmen) U+230B
"〈" 〈 〈 linke winklige Klammer U+2329
"〉" 〉 〉 rechte winklige Klammer U+232A
"◊" ◊ ◊ Raute U+25CA
"♠" ♠ ♠ gefülltes Pik U+2660
"♣" ♣ ♣ gefülltes Kreuz U+2663
"♥" ♥ ♥ gefülltes Herz U+2665
"♦" ♦ ♦ gefülltes Karo U+2666
""" " " Anführungszeichen U+0022
"&" & & Ampersand U+0026
"<" < < weniger als U+003C
">" > > mehr als U+003E
"Œ" Œ Œ große lateinische Ligatur OE U+0152
"œ" œ œ kleine lateinische Ligatur oe U+0153
"Š" Š Š großes lateinisches S mit Caron U+0160
"š" š š kleines lateinisches s mit Caron U+0161
"Ÿ" Ÿ Ÿ großes lateinisches Y mit Diaeresis U+0178
"ˆ" ˆ ˆ Zirkumflex U+02C6
"˜" ˜ ˜ kleine Tilde U+02DC
" " n-Raum U+2002
" " m-Raum U+2003
" " feiner Leerraum U+2009
"‌" ‌ ‌ Null-Leerraum, der nicht zusammenführt (z.B. um Worte wie www.langerlink.de ohne Trennzeichen zu trennen) U+200C
"‍" ‍ ‍ Null-Leerraum, der zwei Worte zusammenführt U+200D
"‎" ‎ ‎ links-nach-rechts-Fragezeichen U+200E
"‏" ‏ ‏ rechts-nach-links-Fragezeichen U+200F
"–" – – n-Strich = Viertelgeviert U+2013
"—" — — m-Strich = Dreiviertelgeviert U+2014
"‘" ‘ ‘ linkes einfaches Anführungszeichen oben U+2018
"’" ’ ’ rechtes einfaches Anführungszeichen oben U+2019
"‚" ‚ ‚ einfaches Anführungszeichen unten U+201A
"“" “ “ linkes doppeltes Anführungszeichen oben U+201C
"”" ” ” rechtes doppeltes Anführungszeichen oben U+201D
"„" „ „ doppeltes Anführungszeichen unten U+201E
"†" † † "Dolch" U+2020
"‡" ‡ ‡ doppelter "Dolch" U+2021
"‰" ‰ ‰ Promille U+2030
"‹" ‹ ‹ einzelnes, nach links weisendes winkliges Anführungszeichen U+2039
"›" › › einzelnes, nach rechts weisendes winkliges Anführungszeichen U+203A
"€" € € Euro U+20AC

 

Quelle 1: http://www.sachen-fuer-webmaster.de/artikel/83.html

Quelle 2: http://de.wikipedia.org/wiki/Wikipedia:Sonderzeichen

Quelle 3: http://www.unicode.org/charts/ hier findet man alles zum Unicode