属性类型

事件系统

USS 支持的属性

本主题列出了支持的 USS 属性及其接受的值。

USS 语法

UIElements 样式属性使用与 W3C CSS 文档相同的语法句法：

关键字值按原样显示。例如：auto、baseline。
基本数据类型出现在尖括号（< 和 >）之间。例如：<length>、<color>。
与属性具有相同名称的非尾端出现在尖括号（< 和 >）之间。例如，<border-width>。

如果属性值包含多个组件：

几个词并列意味着它们全部必须以给定的顺序出现。
A bar (|) separates two or more alternatives: exactly one must occur.
A double bar (||) separates two or more options: one or more must occur, in any order.
双＆符号 (&&) 分隔两个或多个组件：全部都必须出现，顺序任意。
方括号 ([ ]) 表示分组。

每个类型、关键字或尖括号组的后面都可以跟修饰符：

星号 (*) 表示前面的类型、词或组出现零次或多次。
加号 (+) 表示前面的类型、词或组出现一次或多次。
问号 (?) 表示前面的类型、词或组是可选的。
花括号中的一对数字 ({A,B}) 表示前面的类型、词或组出现至少 A 次且最多 B 次。

框形模型

尺寸

width: <number>
height: <number>
min-width: <number>
min-height: <number>
max-width: <number>
max-height: <number>

width 和 height 指定元素的大小（以像素为单位）。如果未指定 width，则宽度基于元素内容的宽度。如果未指定 height，则高度基于元素内容的高度。

边距

margin-left: <number>
margin-top: <number>
margin-right: <number>
margin-bottom: <number>

边框

border-left-width: <number>
border-top-width: <number>
border-right-width: <number>
border-bottom-width: <number>

填充

padding-left: <number>
padding-top: <number>
padding-right: <number>
padding-bottom: <number>

灵活布局

本节列出了用于定位视觉元素的属性。UIElements 包括一个布局引擎，可根据布局和样式属性定位视觉元素。该布局引擎实现了名为 Flexbox 的 HTML/CSS 布局系统的子集。

默认情况下，所有项都垂直放置在其容器中。

项

flex-grow: <number>
flex-shrink: <number>
flex-basis: <number> | auto
flex: none | [ <flex-grow> [ <flex-shrink> <flex-basis>? ]? ]
align-self: auto | flex-start | flex-end | center | baseline | stretch

注意：由于不支持 units，必须始终最后指定 <flex-basis>。

容器

flex-direction: row | row-reverse | column | column-reverse
flex-wrap: nowrap | wrap | wrap-reverse
align-content: flex-start | flex-end | center | space-between | space-around | stretch
align-items: flex-start | flex-end | center | baseline | stretch
justify-content: flex-start | flex-end | center | space-between | space-around | space-evenly

相对和绝对位置

定位

position: absolute | relative

默认情况下，此属性设置为 relative：根据父级来定位元素。如果此属性设置为 absolute，则元素将保留其父级布局，并根据父级边界指定值。

位置

left
top
right
bottom

相对于元素父级边缘或原始位置的像素距离。

绘制属性

绘制属性用于设置视觉元素的背景、边框和外观。

背景

background-color: <color>
background-image: <resource> | <url> | none
-unity-background-scale-mode: stretch-to-fill | scale-and-crop | scale-to-fit

边框

border-color: <color>
border-left-radius: <number>
border-top-radius: <number>
border-right-radius: <number>
border-bottom-radius: <number>

外观

overflow: hidden | visible
opacity: <number>
visibility: visible | hidden

文本属性

文本属性用于设置颜色、字体、字体大小以及 Unity 特有属性（字体资源、字形、对齐、自动换行和剪切）。

color: <color>
-unity-font: <resource> | <url>
font-size: <number>
-unity-font-style: normal | italic | bold | bold-and-italic
-unity-text-align: upper-left | middle-left | lower-left | upper-left | middle-center | lower-center | upper-right | middle-right | lower-right
-unity-word-wrap: true | false
-unity-clipping: clip | overflow

光标属性

使用 cursor 默认纹理类型可为光标导入自定义纹理。Unity Editor 仅支持默认光标值。

已启用和更名的属性

本节列出了在 UIElements 中已启用或更名的绘制属性。这些已弃用和更名的属性按字母顺序列出。

background-size 已更名为 -unity-background-scale-mode。
border-left、border-top、border-right 和 border-bottom 已分别更名为 border-left-width、border-top-width、border-right-width 和 border-bottom-width。
font 已更名为 -unity-font。
font-style 已更名为 -unity-font-style。
position-left、position-top、position-right 和 position-bottom 已分别更名为 left、top、right 和 bottom。
position-type 已更名为 position。
text-alignment 已更名为 -unity-text-align。
text-clipping 已更名为 -unity-clipping。建议使用标准的 overflow 属性。
text-color 已更名为 color。
-word-wrap 已更名为 -unity-word-wrap。

2018–11–16 页面已修订并只进行了有限的编辑审查