CSS3 Appearance Property Example [How To]

“How to write an Appearance property in CSS”?

A CSS Appearance property is used to change the appearing of element to resemble native UI using a platform native styling based on the user operating system theme.

The appearance property is not supported most of browsers like IE, safari etc.

Stayed Informed - CSS Properties Values and Examples

CSS Syntax:-

#divDemo {
    -moz-appearance:button; 
    -webkit-appearance:button;
    appearance:button;
   
    background-color:red;
    color:#fff;
    height:30px;
}

Example as,

<!DOCTYPE html>
<html>
<head>
<style> 
#divDemo {
    -moz-appearance:button; 
    -webkit-appearance:button;
    appearance:button;
   
    background-color:red;
    color:#fff;
    height:30px;
}
</style>
</head>
<body>
  <div id="divDemo"><b>Demo CSS for Appearance property!</b></div>
</body>
</html>

The live demo Result as,

Demo CSS for Appearance property!

Pin it

Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..

My Tech Blog - https://www.code-sample.com/
My Books - Book 1 and Book 2