用户界面CSS属性

改变元素的默认显示样式，注意此属性不是标准属性，很多取值不支持且浏览器表现不一致

appearance：none | button | button-bevel ...

默认值： none

适用于：所有元素

继承性：无

none：

去除系统默认appearance的样式

button：

以按钮的风格渲染

button-arrow-down：

button-arrow-next：

button-arrow-previous：

button-arrow-up：

button-bevel：

button-focus：

caps-lock-indicator：

caret：

checkbox：

以复选框的风格渲染

checkbox-container：

checkbox-label：

checkmenuitem：

default-button：

dualbutton：

groupbox：

listbox：

以列表框的风格渲染

listitem：

以列表项的风格渲染

media-fullscreen-button：

media-mute-button：

media-play-button：

media-seek-back-button：

media-seek-forward-button：

media-slider：

media-sliderthumb：

menuarrow：

menubar：

menucheckbox：

menuimage：

menuitem：

menuitemtext：

menulist：

menulist-button：

menulist-text：

menulist-textfield：

menupopup：

menuradio：

menuseparator：

meterbar：

meterchunk：

progressbar：

以进度条的风格渲染

progressbar-vertical：

以垂直进度条的风格渲染

progresschunk：

以进度块的风格渲染

progresschunk-vertical：

以垂直进度块的风格渲染

push-button：

radio：

以单选框的风格渲染

radio-container：

radio-label：

radiomenuitem：

resizer：

resizerpanel：

scale-horizontal：

scalethumbend：

scalethumb-horizontal：

scalethumbstart：

scalethumbtick：

scalethumb-vertical：

scale-vertical：

scrollbarbutton-up：

以滚动条按钮-上的风格渲染

scrollbarbutton-right：

以滚动条按钮-右的风格渲染

scrollbarbutton-down：

以滚动条按钮-下的风格渲染

scrollbarbutton-left：

以滚动条按钮-左的风格渲染

scrollbargripper-horizontal：

scrollbargripper-vertical：

scrollbarthumb-horizontal：

以水平滚动条滑块的风格渲染

scrollbarthumb-vertical：

以垂直滚动条滑块的风格渲染

scrollbartrack-horizontal：

以水平滚动条拖动区域的风格渲染

scrollbartrack-vertical：

以垂直滚动条拖动区域的风格渲染

searchfield：

以搜索框的风格渲染

searchfield-cancel-button：

以搜索框取消按钮的风格渲染

searchfield-decoration：

searchfield-results-button：

searchfield-results-decoration：

separator：

sheet：

slider-horizontal：

sliderthumb-horizontal：

sliderthumb-vertical：

slider-vertical：

spinner：

spinner-downbutton：

spinner-textfield：

spinner-upbutton：

splitter：

square-button：

statusbar：

statusbarpanel：

tab：

以照选项卡标签的风格渲染

tabpanel：

以照选项卡区域的风格渲染

tabpanels：

tab-scroll-arrow-back：

tab-scroll-arrow-forward：

textarea：

以多行文本框的风格渲染

textfield：

以单行行文本框的风格渲染

textfield-multiline：

toolbar：

toolbarbutton：

toolbarbutton-dropdown：

toolbargripper：

toolbox：

tooltip：

以气泡提示的风格渲染

treeheader：

treeheadercell：

treeheadersortarrow：

treeitem：

treeline：

treetwisty：

treetwistyopen：

treeview：

对于边界超出部分适用规则,此属性需同时定义:width:非auto,overflow:非visible,white-space:nowrap值

text-overflow：clip | ellipsis

默认值： clip

适用于：块级容器元素

继承性：无

外边框不占盒模型位置

outline：<' outline-width '> || <' outline-style '> || <' outline-color '>

默认值： 看每个独立属性

适用于：所有元素

继承性：无

相关属性: <' outline-offset '>

outline-width：<length> | thin | medium | thick

默认值：medium

适用于：所有元素

继承性：无

length：

用长度值来定义轮廓的厚度。不允许负值

medium：

定义默认宽度的轮廓。

thin：

定义比默认宽度细的轮廓。

thick：

定义比默认宽度粗的轮廓。

outline-color：color | invert

默认值：invert

适用于：所有元素

继承性：无

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

默认值：none

适用于：所有元素

继承性：无

none：

无轮廓。与任何指定的 <' outline-width '> 值无关

dotted：

点状轮廓。

dashed：

虚线轮廓。

solid：

实线轮廓

double：

双线轮廓。两条单线与其间隔的和等于指定的 <' outline-width '> 值

groove：

3D凹槽轮廓。

ridge：

3D凸槽轮廓。

inset：

3D凹边轮廓。

outset：

3D凸边轮廓。

outline-offset：length

默认值：0

适用于：所有元素

继承性：无

length：

用长度值来定义轮廓偏移。允许负值。

设置鼠标样式,和系统相关

缩放元素

zoom：normal |number |percentage

默认值：normal

适用于：所有元素

继承性：有

设置盒模型类型

box-sizing：content-box | border-box

默认值：content-box

继承性：无

content-box：

padding和border不被包含在定义的width和height之内。对象的实际宽度等于设置的width值和border、padding之和，即 ( Element width = width + border + padding )

此属性表现为标准模式下的盒模型。

border-box：

padding和border被包含在定义的width和height之内。对象的实际宽度就等于设置的width值，即使定义有border和padding也不会改变对象的实际宽度，即 ( Element width = width )

此属性表现为怪异模式下的盒模型。

resize：none | both | horizontal | vertical

默认值：none

适用于：所有 overflow设置为非visible的元素

继承性：无

none：

不允许用户调整元素大小。

both：

用户可以调节元素的宽度和高度。

horizontal：

用户可以调节元素的宽度

vertical：

用户可以调节元素的高度。

ime-mode：auto | normal | active | inactive | disabled

默认值：auto

适用于：所有输入文本框

继承性：无

auto：

不影响IME(input method editor)的状态。

normal：

正常的IME状态

active：

指定所有使用ime输入的字符。即激活本地语言输入法。用户仍可以撤销激活ime

inactive：

指定所有不使用ime输入的字符。即激活非本地语言。用户仍可以撤销激活ime

disabled：

完全禁用ime。对于有焦点的控件(如输入框)，用户不可以激活ime

user-select：none | text | all | element

默认值：text

适用于：除替换元素外的所有元素

继承性：无

none：

文本不能被选择

text：

可以选择文本

all：

当所有内容作为一个整体时可以被选择。如果双击或者在上下文上点击子元素，那么被选择的部分将是以该子元素向上回溯的最高祖先元素。

element：

可以选择文本，但选择范围受元素边界的约束

主要用于是遮盖元素不响应鼠标事件

pointer-events：auto | none

默认值：auto

适用于：所有元素

继承性：有

auto：

与pointer-events属性未指定时的表现效果相同。

none：

元素永远不会成为鼠标事件的target。但是，当其后代元素的pointer-events属性指定其他值时，鼠标事件可以指向后代元素，在这种情况下，鼠标事件将在捕获或冒泡阶触发父元素的事件侦听器。