INFO + FRAGE + ANTWORT
Ausgewählt: INFO Nr. 414
zum Thema 		MULTIMEDIA WEBDESIGN HTML CSS
Stichwörter: HTML, CSS, Ebenen, Positionierung, Anordnung, z-Index
Inhalt: cadat info CSS - Ebenen: Positionierung, z-Index
Ebenen (Layer) sind in HTML Objekte, die durch den Tag <div> und das Attribut "id" definiert sind.
Die Position wird durch Abstandangaben und die Größe des rechteckigen Objekts durch Breiten- und Höhenangaben bestimmt.
Werden Ebenen überlappend angeordnet, können oben liegende Ebenen darunter liegende verdecken. Dies wird durch das Attribut "z-index" geregelt. Ebenen mit einem größeren Z-Index sind weiter vorne bzw. weiter oben angeordnet.
Die Eigenschaften der Layer werden mittels CSS im Beginntag durch das Attribut "style", im Head oder in einer externen CSS-Datei mit dem Layernamen und dem voreingestellten Zeichen "#" beschrieben.
In Dreamweaver werden die Ebenen im Ebenenfenster hierarchisch und namentlich angezeigt und können im Layout-Modus auch mit der Maus verschoben bzw. größenmäßig geändert werden.
Beispiel:
<div id="layer1" style="position:absolute; width:130px; height:60px; z-index:1; left: 103px; top: 100px;">
<div id="layer2" style="position:absolute; width:130px; height:60px; z-index:2; left: 120px; top: 130px;">
<div id="layer3" style="position:absolute; width:130px; height:60px; z-index:3; left: 140px; top: 160px;">
??? FRAGE Nr. 402
zum Thema 		MULTIMEDIA WEBDESIGN HTML CSS
Frage: Wodurch kann bei Ebenen in HTML-Dateien die Anordnung bzw. Reihenfolge mittels CSS geregelt werden?
  Welche Antwort / Antworten ist / sind richtig? (Mindestens 1 Antwort ist, maximal 6 Antworten sind richtig)
  A  durch Attribut z-Index (weiter unten liegende Ebenen haben höheren z_index)
  B  durch Attribut layer (weiter oben liegende Ebenen haben höhere "Layer-Werte")
  C  durch Attribut layer (zB layer:top;)
  D  durch Anordnung der Layer-Namen (zB layer1, layer2, layer3...)
  E  durch Attribut z-Index (weiter oben liegende Ebenen haben höheren z_index)
  F  zB style="position:absolute; width:130px; height:60px; z-index:3; left: 140px; top: 160px;"
  max. 3 Punkte