In Html-Dokumenten können Elemente frei positioniert werden. Der Koordinatenursprung des Koordinatensystems befindet sich links oben. Auch der Positionierungspunkt des Elementes befindet sich links oben, während von diesem Punkt ausgehend die Breite und Höhe des Elementes angegeben werden. Positive Zahlen gehen von links nach rechts und von oben nach unten.
Die einzelnen Elemente können sich überlappen und funktionieren wie Ebenen. Die oberste Ebene überdeckt die darunterliegende. Mithilfe des z-index wird bestimmt, welche Ebene das Element darstellt. Zur eindeutigen Definition des Elementes dienen Name und ID.

Ein Element kann unsichtbar oder sichtbar, usw.werden.

Jedes Element besitzt einen Rahmen mit Linienfüllung, eine Flächenfüllung (Farbe oder Bild) und einen definierbaren Abstand zum Rahmen. Jede Seite kann einzeln verändert werden.

Im Navigator 4.0

heißen die Elemente layer

<layer z-index=4 bgcolor="#00FF11" id="anton" name="anton" top=10 left=10 width=200 height=100 clip="0,0,50,10">
    nur text oder bild oder link
</layer>

visibility = show oder hide

Ab Internet Explorer 4.0

wird dieses Element durch ein css-tag definiert. Dieses ist ein Unterobjekt des all-Objektes.

<html>
    <head>
        <style type="text/css"><!--
            p{/*alle Rahmeneinstellungen:*/
                z-index:4;/*Ebenenhierachie*/
                position:absolute;/*relative*/
                top:10; left:10; width:200; height:100;
                clip:rect(0px 0px 50px 10px);/*sichtbarer Bereich*/
                border:2px solid #DDFFCC;/*Aussenrand Rahmen*/
                background-color:"#002211";
                background-image:url(bild.gif);
                background-repeat:repeat-x /*repeat-y,no-repeat*/
                background-position:30px 20px;
                padding:5px;/*Innenabstand*/
                margin:1px;/*Aussenabstand*/
                border-style:solid;
                border-width:1px
                visibility:hidden /*visible*/
                cursor:crosshair;/*auto,pointer,move,n-resize,text,wait*/

                text-indent:-20pt/*Texteinrückung*/
                line-height:14pt /*Zeilenhöhe*/ 
            }
            h1,h2{/*Alle Schriftformatierungen:*/
                font-family:"Times new roman",Arial,serif; /*Schriftart*/
                font-style:oblique;/* bzw font-weight:bold Schriftstil:italic,normal*
                font-variant:small-caps; /*Schriftvariante=Kapitälchen:normal*/
                font-size:120%; /*Schriftgröße*/
                font:12pt/14pt; /*Schrift allgemein=Schrift und Zeilenhöhe*/
                letter-spacing /*Zeichenabstand nicht netscape4.0*/
                text-decoration:none; /*Textdekoration*/
                text-transform /*Texttransformation*/
                color /*Textfarbe*/
            }
            -->
        </style>
    </head>
    <body>
        <p id="anton">
            nur text oder bild oder link
        </p>
    </body>
</html>

bei netscape: margin:0px!

bei Explorer: border-style:solid; border-width:thin braucht beides!

Laut Standard wird es durch das DOM-Modell beschrieben.

JavaScript

Einführung

Variable

Array

Funktion

Html

Objekt

Fenster

Bedingungen

Formular

Dhtml Rahmen

Seminare für Betriebsysteme:

Seminare für Microsoft Office:

Seminare für Software von Adobe:

Spezielle Seminarpakete:

Ihre Meinung ist mir wichtig!

Positionierbare Elemente

Im Navigator 4.0

Ab Internet Explorer 4.0