外观属性使用基于用户操作系统主题的平台原生样式显示元素。
-moz-appearance 属性在 Gecko (Firefox) 中使用，以使用基于操作系统主题的平台原生样式来显示元素。
-webkit-appearance 属性是 WebKit 浏览器引擎支持的专有 CSS 扩展。
WebKit 扩展包含 -webkitprefix，表明它属于 WebKit 开源框架。
-webkit-appearance 属性不是官方 W3C CSS 规范的一部分，旨在用于由 WebKit 浏览器引擎提供支持的浏览器，例如 Apple Safari 和 Google Chrome。
如果在上使用此属性，则应谨慎测试。
外观属性的实现可能大不相同，尤其是在旧浏览器中。
但是在较新的浏览器中，只有很小的差异。
这是一项实验性技术。
| 初始值 | auto |
|---|---|
| 应用于 | 所有元素。 |
| 继承 | 无效 |
| 可动画的 | 是 |
| 版本 | CSS3. |
| DOM 语法 | object.Style.AppeArance =“none”; |
语法
appearance: none | auto | initial | inherit | icon | window | button | menu | field | desktop | workspace | document | tooltip | dialogue | push-button | hyperlink | radio-button | checkbox | menu-item | tab | menubar | outline-tree | range | signature | password;
外观属性示例：
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
div {
width: 80px;
height: 25px;
line-height: 25px;
text-align: center;
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
}
</style>
</head>
<body>
<h2>Appearance 属性示例</h2>
<p>Here is a...</p>
<div>Button?</div>
</body>
</html>
CSS appearance 属性值说明
| 值 | 描述 |
|---|---|
| none | 这是默认值。没有应用特殊造型。 |
| auto | 用户代理基于元素选择适当的特殊样式。作为没有特殊造型的元素。 |
| icon | 一张代表对象的小图片，通常有名称或者标签。 |
| window | 一个视口，用于呈现对象和内容的框架表面，以供用户查看和交互。 |
| button | 一个通常标有表示用户选择的文本的小对象。 |
| menu | 用户选择的一组选项，也许是一次多于一个。有几种特定类型的菜单。 |
| field | 为用户提供了一个区域，用于输入或者编辑值，通常使用键盘。有几个特殊的领域。 |
| desktop | 用于表示整个系统的窗口通常包含其他窗口。 |
| workspace | 用于表示可能包含其他窗口的项目（item）（item）或者应用程序的窗口，通常使用显示项目（item）（item）或者应用程序名称的标题列。 |
| document | 用于表示用户文档的窗口，通常使用显示其名称的标题列。也可用于表示文件系统中的文件夹或者目录。 |
| tooltip | 用于临时显示对象的信息或者帮助的窗口。在CSS2系统颜色中也称为“INFO”。 |
| dialogue | 用于向用户提供通知或者替代方案的窗口作为用户所采取的动作的一部分。在CSS2系统字体中也称为“Message-Box”。 |
| push-button | 一个有边框的按钮，通常斜面出现三维，好像它被提升。 CSS2系统字体中也称为“标题”。 |
| hyperlink | 表示超文本链接的按钮，通常像普通文本一样简单，且可能有不同的彩色。 |
| radio-button | 一个按钮在按钮标签旁边的小圆圈中显示它是否检查它。选中按钮时，圆圈内可能有一个圆盘。可以用圆圈中的一些其他图形来指示不确定（既未检查的也不选中）状态。 |
| checkbox | 该元素是绘制的复选框，包括实际“复选框”部分。 |
| menu-item | 菜单中的一个选择，也可以充当嵌套（分层）菜单的标签。 |
| tab | 表示选项卡式接口中窗格标签的按钮。 |
| menubar | 菜单中的菜单，通常在水平杆中线性排列。 |
| outline-tree | 一个菜单，可以使用小小部件显示或者隐藏选项，通常由小三角形或者加号和减号表示。 |
| range | 显示当前选项的控件可能是图形方式，并且允许用户选择其他选项，也许是拖动滑块或者转动旋钮。 |
| signature | 用于输入签名的字段。 |
| password | 输入密码的字段。通常，文本呈现为一组符号或者框以掩盖值。 |
| initial | 使属性使用其默认值。 |
| inherit | 从父母元素继承属性。 |
日期：2020-06-02 22:14:24 来源：oir作者：oir