- die Online CSS Referenz
Impressum

Sonstige Eigenschaften

display | cursor | outline | scrollbar | filter

displayzur Übersicht    eins nach unten

Mit display wird der Anzeigemodus eines Elementes kontrolliert.

Werte

none | block | inline | inline-block | list-item | run-in | inline-table | table | table-caption | table-cell | table-column | table-row | table-columns-group | table-footer-group | table-header-group | table-row-group

none Das Element wird nicht angezeigt. Im Gegensatz zu der Eigenschaft visibility wird dem Element auch kein Platz eingeräumt.
block Das Element wird als Block-Element dargestellt.
inline Das Element wird als Inline-Element dargestellt. Damit lassen sich Blockelemente wie z.B. Überschriften (<h1>) in den Textfluß zwingen.
inline-block Dieser Wert erstellt eine Mischung aus einem Block- und einem Inline-Element. Es wird als Block-Element formatiert, es können Höhe, Breite und Außenabstände angegeben werden, es fliesst aber wie ein Inline-Element in der Zeile.
list-item Das Element wird als Listenelement dargestellt und hat ein Aufzählungszeichen.
run-in Je nach weiteren Inhalten wird ein Block- oder Inline-Element erzeugt.
inline-table Wird als Tabelle dargestellt, allerdings ohne den bei <table> üblichen Absatz.
table Darstellung als Tabelle mit dem üblichen Absatz - entspricht HTML <table>
table-caption Darstellung als Tabellenüberschrift - entspricht HTML <caption>
table-cell Darstellung als Tabellenzelle - entspricht HTML <td>
table-column Darstellung als Tabellenspalte - entspricht HTML <col>
table-row Darstellung als Tabellenreihe - entspricht HTML <tr>
table-columns-group Darstellung als Gruppierung von Tabellenspalten - entspricht HTML <colgroup>
table-footer-group Darstellung als Gruppierung von Tabellenzellen als Fusszeile in einer Tabelle - entspricht HTML <tfooter>
table-header-group Darstellung als Gruppierung von Tabellenzellen als Kopfzeile in einer Tabelle - entspricht HTML <thead>
table-row-group Darstellung als Gruppierung von Tabellenreihen - entspricht HTML <tbody>

Standardwert ist entweder block (CSS1) oder inline (CSS2)

Vererbung

Nein

Beispiel

h2{
font-size: 12px;
font-weight: bold;
display: inline;
}

display

cursorzur Übersichteins nach obeneins nach unten

Die Anweisung cursor legt das Aussehen des Mauszeigers für das formatierte Element fest. Fährt der Mauszeiger über das Element, verändert er sich in der angegebenen Form.

Werte

auto | default | crosshair | help | pointer | wait | text | n-resize | e-resize | s-resize | w-resize | ne-resize | nw-resize | se-resize | sw-resize | url()

Der Wert url() erlaubt die Angabe eines eigenen Cursors und den Dateiformaten: *.ani, *.cur, *.ico, *.gif und *.jpg. Da Browser die Angaben unterschiedlich interpretieren, sollten mehrere, alternative Werte zu setzen: cursor:url(curs.jpg), url(curs.ani), url(curs.cur), default;

Standardwert ist auto

Vererbung

Ja

Beispiel

td{ cursor: pointer;}

cursor

outlinezur Übersichteins nach obeneins nach unten

outline-style | outline-width | outline-color | inherit

Mit outline wird eine Umrandung um ein Elemente gezeichnet. Im Gegensatz zu border wird outline nicht in der Breiten- und Höhenberechnung berücksichtigt.

Werte

outline-style
none | dotted | dashed | double | groove | inset | outset | ridge | solid

outline-width
thin | medium | thick | [Breite]

outline-color
[Farbwert] | invert

Standardwerte sind
outline-style: none
outline-width: medium
outline-color: invert

Vererbung

Nein

Beispiel

<p style="outline: 1px dashed #ff0000;">Ein Text mit Rand</p>

outline

scrollbarzur Übersichteins nach obeneins nach unten

scrollbar-3dlight-color | scrollbar-arrow-color | scrollbar-base-color | scrollbar-darkshadow-color | scrollbar-face-color | scrollbar-highlight-color | scrollbar-shadow-color | scrollbar-track-color

Diese Eigenschaft ist ein Microsoft spezifisches StyleSheet und kein offizieller CSS-Standard. Die Angaben verändern das Aussehen der Scrollbalken. Dies wird aber nur vom Internet Explorer und Opera 7+ dargestellt. Andere Browser ignorieren diese Eigenschaften. Die Eigenschaft kann im Internet Explorer auf <applet>, <body>, <html>, <div>, <embed>, <object> und <textarea> angewendet werden, im Opera nur auf <body>. Mit scrollbar-base-color kann eine Basisfarbe gesetzt werden - die einzelnen Eigenschaften setzt der Browser an Hand dieser Farbangabe.

Werte

Alle Eigenschaften erwarten einen Farbwert.

Standardwerte sind nicht gesetzt.

Vererbung

Nein

Beispiel

textarea{
scrollbar-base-color: #a6a637;
scrollbar-3dlight-color: #fff;
scrollbar-arrow-color: #000;
scrollbar-darkshadow-color: #626220;
scrollbar-face-color: #b9b679;
scrollbar-highlight-color: #999933;
scrollbar-shadow-color: #333;
scrollbar-track-color: #f0f3e4;
}

scrollbar

filterzur Übersichteins nach oben    

Alpha | Blur | Chroma | DropShadow | FlipH | FlipV | Glow | Gray | Invert | Mask | Shadow | Wave | XRay

filter ist eine weitere Microsoft-proprietäre Eigenschaft und gehört ebenfalls nicht zum CSS-Standard. Die filter-Effekte sind einigen Filtern aus der Bildbearbeitung nachempfunden. Da diese Eigenschaften nur vom Internet Explorer interpretiert werden, empfiehlt es sich Bilder mit Filtereffekten direkt in einem Bildbearbeitungsprogramm zu erstellen.

filter: Alpha() Transparenzeffekt
filter: Blur() Verwischen
filter: Chroma() Farbtransparenz
filter: DropShadow() Schattenrand
filter: FlipH() horizontale Spiegelung
filter: FlipV() vertikale Spiegelung
filter: Glow() glühender Rand
filter: Gray() Graustufeneffekt
filter: Invert() kehrt Farbwerte um
filter: Mask() Transparenzmaske
filter: Shadow() Schattenwurf
filter: Wave() Welleneffekt auf der X-Achse
filter: XRay() Fotonegativeffekt

Werte

Die Werte richten sich nach den entsprechenden Filtern. Die genauen Werte sind auf selfHTML nachzulesen.

Standardwerte sind nicht gesetzt.

Vererbung

Nein

Beispiel

<img src="farn.jpg" style="filter:Wave(freq=3, lightstrength=40, phase=25, strength=8);" width="260" height="120" alt="" />

filter