CSS - appearance

Example

 

CSS
.exampleone {
  appearance: auto;
}

Syntax  

CSS
appearance: auto;
appearance: none;

Values

<appearance> is one of the keywords in the table below.

Value Demo Description
auto  

(Default) The user agent may render form controls using native controls of the host operating system. When computing auto, the user agent must still honor the following properties:

  • all
  • bottom
  • clear
  • cursor
  • direction
  • display
  • float
  • left
  • margin
  • position
  • right
  • top
  • unicode-bidi
  • visibility 
  • z-index
none   Form controls are not made to look like native controls. The element is rendered following the usual rules of CSS.  No other replaced elements other than form controls are affected. 

Formal syntax

CSS
auto <a href="css/value_definition_syntax#single_bar" title="Single bar">|</a> none

Description  

This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.

The appearance CSS property indicates whether to display an element using platform-native styling based on the operating system's theme or not.

Initial valueauto
Applies toall elements
Inheritedno
Mediaall
Computed valueAs specified
Animatablediscrete
Canonical orderper grammar

Browser Compatibility  

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 52.0-webkit [1]     39  
Feature Android Android Webview Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile Chrome for Android
Basic support No support 52.0-webkit [1]     39   52.0-webkit [1]

[1] Applies to the <meter> element only.

Specifications  

Specification Status Comment
CSS Basic User Interface Module Level 4
The definition of 'appearance' in that specification.
Editor's Draft Initial definition.

License

© 2016 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-us/docs/web/css/appearance

CSS CSS Reference Experimental