-moz-appearance (-webkit-appearance)

Kein Standard

Diese Funktion entspricht nicht dem Standard und ist nicht Teil der Standardisierung. Diese Funktion darf nicht in Webseiten, die via das Internet zug├Ąnglich sind, benutzt werden: Sie wird nicht f├╝r alle Nutzer funktionieren. Es kann zu umfangreichen Inkompatibilit├Ąten zwischen verschiedenen Implementierungen kommen und die Funktionsweise oder Eigenschaften k├Ânnten in der Zukunft ver├Ąndert werden.

├ťbersicht

Die CSS-Eigenschaft -moz-appearance wird von Gecko (Firefox) dazu verwendet, um ein Element mit dem nativen Stil der Plattform anzuzeigen, wie er im Betriebssystem eingestellt ist.

Diese Eigenschaft wird h├Ąufig in XUL-Stylesheets verwendet, um individuelle Eingabefelder passend zur Plattform zu gestalten. Auch die XBL-Implementierungen der in Mozilla enthaltenen Bedienelemente verwenden diese Eigenschaft.

Verwende diese Eigenschaft nicht f├╝r Websites: Sie entspricht nicht den Webstandards und ihre Auswirkungen unterscheiden sich von einem Browser zum anderen. Sogar der Wert none hat in den verschiedenen Browsern kein einheitliches Verhalten f├╝r alle Formularelemente, und teilweise wird sie ├╝berhaupt nicht unterst├╝tzt.

Initialwertauto
Anwendbar aufalle Elemente
VererbtNein
Berechneter Wertwie angegeben
Animationstypdiskret

Syntax

/* Partielle Liste verf├╝gbarer Werte in Gecko */
-moz-appearance: none;
-moz-appearance: button;
-moz-appearance: checkbox;
-moz-appearance: scrollbarbutton-up;

/* Partielle Liste verf├╝gbarer Werte in WebKit/Blink */
-webkit-appearance: none;
-webkit-appearance: button;
-webkit-appearance: checkbox;
-webkit-appearance: scrollbarbutton-up;

Werte

<appearance> ist eines der folgenden Schl├╝sselw├Ârter:

Wert Demo Beschreibung
none Keine besondere Formatierung wird angewandt. Dies ist der Standardwert. Beachten Sie aber Bug 649849 und Bug 605985.
button Das Element wird wie eine Schaltfl├Ąche gezeichnet.
button-arrow-down  
button-arrow-next  
button-arrow-previous  
button-arrow-up  
button-bevel  
button-focus  
caret  
checkbox Das Element wird wie der innere Teil einer Checkbox gezeichnet.
checkbox-container Das Element wird wie ein Container f├╝r eine Checkbox gezeichnet, was einen vorilluminierenden Hintergrundeffekt unter bestimmten Plattformen beinhaltet. Normalerweise beinhaltet er ein Label und eine Checkbox.
checkbox-label  
checkmenuitem  
dualbutton  
groupbox  
listbox  
listitem  
menuarrow  
menubar  
menucheckbox  
menuimage  
menuitem Das Element wird wie ein Men├╝eintrag dargestellt, wobei der Eintrag hervorgehoben wird, wenn sich der Mauscursor dar├╝ber befindet.
menuitemtext  
menulist  
menulist-button Das Element wird wie eine Schaltfl├Ąche dargestellt, die eine Men├╝liste darstellt, die ge├Âffnet werden kann.
menulist-text  
menulist-textfield Dieses Element wird wie ein Texteingabefeld einer Men├╝liste dargestellt. (Nicht f├╝r die Windows Plattform implementiert.)
menupopup  
menuradio  
menuseparator  
meterbar Neu in Firefox 16
meterchunk Neu in Firefox 16
progressbar Das Element wird wie ein Fortschrittsbalken dargestellt.
progressbar-vertical  
progresschunk  
progresschunk-vertical  
radio Das Element wird wie der innere Teil eines Radiobuttons gezeichnet.
radio-container Das Element wird wie ein Container f├╝r einen Radiobutton gezeichnet, was einen vorilluminierenden Hintergrundeffekt unter bestimmten Plattformen beinhaltet. Normalerweise beinhaltet er ein Label und einen Radiobutton.
radio-label  
radiomenuitem  
resizer  
resizerpanel  
scale-horizontal  
scalethumbend  
scalethumb-horizontal  
scalethumbstart  
scalethumbtick  
scalethumb-vertical  
scale-vertical  
scrollbarbutton-down  
scrollbarbutton-left  
scrollbarbutton-right  
scrollbarbutton-up  
scrollbarthumb-horizontal  
scrollbarthumb-vertical  
scrollbartrack-horizontal  
scrollbartrack-vertical  
searchfield  
separator  
sheet  
spinner  
spinner-downbutton  
spinner-textfield  
spinner-upbutton  
splitter  
statusbar  
statusbarpanel  
tab  
tabpanel  
tabpanels  
tab-scroll-arrow-back  
tab-scroll-arrow-forward  
textfield  
textfield-multiline  
toolbar  
toolbarbutton  
toolbarbutton-dropdown  
toolbargripper  
toolbox  
tooltip  
treeheader  
treeheadercell  
treeheadersortarrow  
treeitem  
treeline  
treetwisty  
treetwistyopen  
treeview  
-moz-mac-unified-toolbar Nur Mac OS X. Dies erm├Âglicht die Darstellung von Toolbar und Titelleiste unter Verwendung des einheitlichen Toolbarstils, wie er in  Anwendungen unter Mac OS X 10.4 und neuer zu sehen ist.
-moz-win-borderless-glass Nur Windows Vista und neuer. Dieser Stil wendet den Aero Glass Effekt - aber ohne einen Rahmen - auf das Element an.
-moz-win-browsertabbar-toolbox Nur Windows Vista und neuer. Dieser Toolboxstil ist dazu gedacht, um f├╝r die Tableiste in einem Browser verwendet zu werden.
-moz-win-communicationstext  
-moz-win-communications-toolbox Nur Windows Vista und neuer. Dieser Toolboxstil ist dazu gedacht, in Kommunikations- und Produktivit├Ątsanwendungen verwendet zu werden. Die entsprechende Vordergrundfarbe ist -moz-win-communicationstext.
-moz-win-exclude-glass Nur Windows Vista und neuer. Dieser Stil wird dazu verwendet, um den Aero Glass Effekt f├╝r das Element auszuschlie├čen.
-moz-win-glass Nur Windows Vista und neuer. Dieser Stil wendet den Aero Glass Effekt auf das Element an.
-moz-win-mediatext  
-moz-win-media-toolbox Nur Windows Vista und neuer. Dieser Toolboxstil ist dazu gedacht, um in Anwendungen verwendet zu werden, die Medienobjekte verwalten. Die Entsprechende Vordergrundfarbe ist -moz-win-mediatext.
-moz-window-button-box  
-moz-window-button-box-maximized  
-moz-window-button-close  
-moz-window-button-maximize  
-moz-window-button-minimize  
-moz-window-button-restore  
-moz-window-frame-bottom  
-moz-window-frame-left  
-moz-window-frame-right  
-moz-window-titlebar  
-moz-window-titlebar-maximized  

Formale Syntax

none | auto | textfield | menulist-button | <compat-auto>

wobei
<compat-auto> = searchfield | textarea | push-button | slider-horizontal | checkbox | radio | square-button | menulist | listbox | meter | progress-bar | button

Beispiele

.exampleone {
	-moz-appearance: toolbarbutton;
}

Spezifikationen

{The appearance property is currently not present in any newer CSS specification.

Browser Kompatibilit├Ąt

Wir konvertieren die Kompatibilit├Ątsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilit├Ątstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst! (en-US)

Merkmal Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Grundlegende Unterst├╝tzung 1.0 1.0 (1.7 oder fr├╝her)-moz (en-US)[1] Nicht unterst├╝tzt ? 3.0-webkit (en-US)
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Grundlegende Unterst├╝tzung ? 1.0 (1.0) 11.0-webkit (en-US)[2] ? ?

[1] Nicht vollst├Ąndig unterst├╝tzt.

[2] Nur die Werte none, button, und textfield werden unterst├╝tzt. Siehe die Dokumentation auf MSDN.

Siehe auch