infoleiste
<table border="0px" width="600px"><tr><td width="300px" style="vertical-align:top;">
<tr><td width="300px" style="vertical-align:top;">
width: <font color="orange">Breite</font>;
</td><td>
Mit<font color="orange"> Width </font>wird die Breite eines Elements festgelegt. Standardwert ist dabei "auto". Will man das Element breiter, bzw. schmaler machen muss eine feste Angabe der Breite erfolgen. Diese kann in Pixel oder Zentimeter (cm), Millimeter (mm), Punkte (pt), Prozent (%) usw. angegeben werden. Wegen der leichteren Verwendung empfehlen wir Pixel, oder Prozent.
Beispiel:<font color="grey">
width: 45px; </font> Die Breite des Elements wird auf 45 Pixel Dicke festgelegt
<font color="grey">width: 120%; </font> Das Element wird 20% breiter zur ursprünglichen Breite angezeigt.
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
height: <font color="orange">Höhe</font>;
</td><td>
Mit<font color="orange"> Height </font>wird die Höhe eines Elements festgelegt. Standardwert ist dabei "auto". Will man das Element länger, bzw. kürzer machen muss eine feste Angabe der Höhe erfolgen. Diese kann in Pixel oder Zentimeter (cm), Millimeter (mm), Punkte (pt), Prozent (%) usw. angegeben werden. Wegen der leichteren Verwendung empfehlen wir Pixel, oder Prozent.
Beispiel:<font color="grey">
height: 45px; </font> Die Höhe des Elements wird auf 45 Pixel Länge festgelegt
<font color="grey">height: 120%; </font> Das Element wird 20% länger zur ursprünglichen Länge angezeigt.
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
border-style: <font color="orange">Umrandung</font>;
</td><td>
Für <font color="orange">Umrandung</font> können verschiedene Angaben, gemacht werden.
Verwendungsmöglichkeiten:
<font color="grey">border-style: dotted; </font>es erscheint ein gepunkteter Rand um das Element
<font color="grey">border-style: dashed; </font>Rand wird gestrichelt angezeigt
<font color="grey">border-style: solid; </font>Rand ist eine durchgehende Linie
<font color="grey">border-style: double; </font>Rand wird mit Doppellinie angezeigt
<font color="grey">border-style: groove; </font>erzeugt einen 3D Effekt
<font color="grey">border-style: ridge; </font>erzeugt einen 3D Effekt
<font color="grey">border-style: inset; </font>erzeugt einen 3D Effekt
<font color="grey">border-style: outset;</font>erzeugt einen 3D Effekt
Mit zusätzlichen Angaben kann man Dicke(border-width) und Farbe(border-color) bestimmen, dazu fasst man die Einzelbefehle am Einfachsten zu einem Befehl zusammen und zwar border.
So würde beispielsweise ein Rahmen mit der Angabe:
<font color="grey">border: 1px solid white;</font>
1px stark sein, durchgehend und weiß. Die Farbe kann entweder in englisch, oder als Hexadezimalzahl angegeben werden.
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
opacity: <font color="orange">ALPHA</font>;
</td><td>
Für <font color="orange">ALPHA</font> kann ein Wert angeben werden, der den Alpha-Grad bzw den Transparenzgrad des Elements bestimmt. Eingesetzt werden können Werte, die sich zwischen <font color="grey">0.0</font> und <font color="grey">1.0</font> bewegen.
Hierbei steht <font color="grey">0.0</font> für die absolute Transparenz, dh das Element mit diesem Wert ist ganz durchsichtig und <font color="grey">1.0</font> für gar keine Transparenz.
Werte dazwischen (wie zb 0.6, 0.9 usw) geben somit die dazwischen liegenden Stärken an.
Für genauere Definitionen können auch gerne Zweistellige Angaben gemacht werden wie z.B. 0.65 o.ä.
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
display: <font color="orange">ANZEIGE</font>;
</td><td>
Gibt die Art der Anzeige des Elements an.
<font color="grey">display: block - zeigt das Element als Block an
display: none - das Element wird nicht angezeigt</font> (ohne Platzhalter.)
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
visibillity: <font color="orange">SICHTBARKEIT</font>;
</td><td>
Ermöglicht das Ein und Ausblenden verschiedener Elemente.
<font color="grey">visibillity: visible - Element ist sichtbar
visibillity: hidden - Element ist unsichtbar</font> (mit Platzhalter.)
INFO:
Die Rolle des Platzhalters sollte beim ein und ausblenden von Elementen unbedingt beachtet werden.
Während bei <font color="grey">display</font> kein Platzhalter stehen bleibt wird bei <font color="grey">visibility</font> einer verwendet.
So kann es sein, dass sich beim Ausblenden via <font color="grey">display</font> umliegende Elemente verschieben bzw nachrücken, bei <font color="grey">visibility</font> hingegen nicht. Auf der an anderen Seite sollte man sich nicht wundern wenn man <font color="grey">visibility</font> verwendet hat aber ein Nachrücken oder Anpassen wünscht.
Merke also: <font color="grey">
display: none; = ganze weg
visibility: hidden; = versteckt</font>
</tr></td>
</table></font>
<a href="http://www.allmystery.de/cgi-bin/allmystery.pl?am=wiki_edit&id=79" target="blank" style="position:absolute;top:43px;left:390px;">Diese Seite bearbeiten[/url]
<style>.header, .userfunction, .infoleiste, h1, .footer, tabnav, .sufu, .tabnav a, div[style=font-size:11px;position:absolute;top:10px;left:5px;background-color:black;color:#FFFFFF], div[id=reklame], a[href=/wiki/], img[src=http://static.allmystery.de/images/left.gif], center a {display: none;} table {margin-top: -200px;} </style>
<tr><td width="300px" style="vertical-align:top;">
width: <font color="orange">Breite</font>;
</td><td>
Mit<font color="orange"> Width </font>wird die Breite eines Elements festgelegt. Standardwert ist dabei "auto". Will man das Element breiter, bzw. schmaler machen muss eine feste Angabe der Breite erfolgen. Diese kann in Pixel oder Zentimeter (cm), Millimeter (mm), Punkte (pt), Prozent (%) usw. angegeben werden. Wegen der leichteren Verwendung empfehlen wir Pixel, oder Prozent.
Beispiel:<font color="grey">
width: 45px; </font> Die Breite des Elements wird auf 45 Pixel Dicke festgelegt
<font color="grey">width: 120%; </font> Das Element wird 20% breiter zur ursprünglichen Breite angezeigt.
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
height: <font color="orange">Höhe</font>;
</td><td>
Mit<font color="orange"> Height </font>wird die Höhe eines Elements festgelegt. Standardwert ist dabei "auto". Will man das Element länger, bzw. kürzer machen muss eine feste Angabe der Höhe erfolgen. Diese kann in Pixel oder Zentimeter (cm), Millimeter (mm), Punkte (pt), Prozent (%) usw. angegeben werden. Wegen der leichteren Verwendung empfehlen wir Pixel, oder Prozent.
Beispiel:<font color="grey">
height: 45px; </font> Die Höhe des Elements wird auf 45 Pixel Länge festgelegt
<font color="grey">height: 120%; </font> Das Element wird 20% länger zur ursprünglichen Länge angezeigt.
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
border-style: <font color="orange">Umrandung</font>;
</td><td>
Für <font color="orange">Umrandung</font> können verschiedene Angaben, gemacht werden.
Verwendungsmöglichkeiten:
<font color="grey">border-style: dotted; </font>es erscheint ein gepunkteter Rand um das Element
<font color="grey">border-style: dashed; </font>Rand wird gestrichelt angezeigt
<font color="grey">border-style: solid; </font>Rand ist eine durchgehende Linie
<font color="grey">border-style: double; </font>Rand wird mit Doppellinie angezeigt
<font color="grey">border-style: groove; </font>erzeugt einen 3D Effekt
<font color="grey">border-style: ridge; </font>erzeugt einen 3D Effekt
<font color="grey">border-style: inset; </font>erzeugt einen 3D Effekt
<font color="grey">border-style: outset;</font>erzeugt einen 3D Effekt
Mit zusätzlichen Angaben kann man Dicke(border-width) und Farbe(border-color) bestimmen, dazu fasst man die Einzelbefehle am Einfachsten zu einem Befehl zusammen und zwar border.
So würde beispielsweise ein Rahmen mit der Angabe:
<font color="grey">border: 1px solid white;</font>
1px stark sein, durchgehend und weiß. Die Farbe kann entweder in englisch, oder als Hexadezimalzahl angegeben werden.
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
opacity: <font color="orange">ALPHA</font>;
</td><td>
Für <font color="orange">ALPHA</font> kann ein Wert angeben werden, der den Alpha-Grad bzw den Transparenzgrad des Elements bestimmt. Eingesetzt werden können Werte, die sich zwischen <font color="grey">0.0</font> und <font color="grey">1.0</font> bewegen.
Hierbei steht <font color="grey">0.0</font> für die absolute Transparenz, dh das Element mit diesem Wert ist ganz durchsichtig und <font color="grey">1.0</font> für gar keine Transparenz.
Werte dazwischen (wie zb 0.6, 0.9 usw) geben somit die dazwischen liegenden Stärken an.
Für genauere Definitionen können auch gerne Zweistellige Angaben gemacht werden wie z.B. 0.65 o.ä.
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
display: <font color="orange">ANZEIGE</font>;
</td><td>
Gibt die Art der Anzeige des Elements an.
<font color="grey">display: block - zeigt das Element als Block an
display: none - das Element wird nicht angezeigt</font> (ohne Platzhalter.)
</tr></td>
<tr><td width="300px" style="vertical-align:top;">
visibillity: <font color="orange">SICHTBARKEIT</font>;
</td><td>
Ermöglicht das Ein und Ausblenden verschiedener Elemente.
<font color="grey">visibillity: visible - Element ist sichtbar
visibillity: hidden - Element ist unsichtbar</font> (mit Platzhalter.)
INFO:
Die Rolle des Platzhalters sollte beim ein und ausblenden von Elementen unbedingt beachtet werden.
Während bei <font color="grey">display</font> kein Platzhalter stehen bleibt wird bei <font color="grey">visibility</font> einer verwendet.
So kann es sein, dass sich beim Ausblenden via <font color="grey">display</font> umliegende Elemente verschieben bzw nachrücken, bei <font color="grey">visibility</font> hingegen nicht. Auf der an anderen Seite sollte man sich nicht wundern wenn man <font color="grey">visibility</font> verwendet hat aber ein Nachrücken oder Anpassen wünscht.
Merke also: <font color="grey">
display: none; = ganze weg
visibility: hidden; = versteckt</font>
</tr></td>
</table></font>
<a href="http://www.allmystery.de/cgi-bin/allmystery.pl?am=wiki_edit&id=79" target="blank" style="position:absolute;top:43px;left:390px;">Diese Seite bearbeiten[/url]
<style>.header, .userfunction, .infoleiste, h1, .footer, tabnav, .sufu, .tabnav a, div[style=font-size:11px;position:absolute;top:10px;left:5px;background-color:black;color:#FFFFFF], div[id=reklame], a[href=/wiki/], img[src=http://static.allmystery.de/images/left.gif], center a {display: none;} table {margin-top: -200px;} </style>