Home > Schule > HTML > Was ist das? > <id> - Individualformate

Individualformate festlegen mit dem Attribut <id>

"id=" gehört auch zu den Universalattributen. Mit Hilfe dieses Attributs können Sie auch wie mit dem class-Attribut die Eigenschaften von Elementen bestimmen. Der große Unterschied zum class-Attribut ist, dass das id-Attribut eindeutig sein muss und pro Seite nur einmal auftreten darf (sonst wäre es nicht mehr eindeutig und individuell, sondern Mitglied einer Klasse).

Daraus ergibt sich die typische Anwendung von Individualformaten - die Definition von Bereichen zur Aufteilung einer Seite.

Den Namen und die Eigenschaften eines Individualformats deklarieren Sie im <style>-Abschnitt einer HTML-Datei im <head> oder in einer CSS-Datei.

Das folgende Beispiel definiert zwei Individualformate:

<style type="text/css">
#linkerBereich {
position:absolute;
top:100px;
left:30px;
width:300px;
padding:10px;
margin:0px;
border:4px solid #EE0000;
}
#rechterBereich {
position:absolute;
top:130px;
left:400px;
width:320px;
padding:50px;
margin:20px;
border:8px solid #0000EE;
background:yellow;
z-index:0;
}
</style>

Sehen Sie sich das Beispiel an.

Ich erwähnte schon, dass das Design dieser Seite durch drei <div>-Elemente bestimmt wird: zwei zur Navigation und eins für die Inhalte.

Sie können sich die Eigenschaften der <div>-Elemente in der Datei test.css ansehen.

Nehmen Sie das Beispiel als Anregung und experimentieren Sie am Design Ihrer eigenen Webseite.

Zurück zur Was ist das?-Seite