所有 QAP/Rax 组件都支持以下通用样式规则。
QAP/Rax 盒模型基于 CSS 盒模型，每个 QAP/Rax 元素都可视作一个盒子。我们一般在讨论设计或布局时，会提到「盒模型」这个概念。
盒模型描述了一个元素所占用的空间。每一个盒子有四条边界：外边距边界 margin edge, 边框边界 border edge, 内边距边界 padding edge 与内容边界 content edge。这四层边界，形成一层层的盒子包裹起来，这就是盒模型大体上的含义。
注意
QAP/Rax 对于长度值目前只支持相对单位rem，单位可省略，不支持px。width {length}：，默认值一般为包含内容，只支持rem，不支持百分比height {length}：，默认值一般为包含内容，只支持rem，不支持百分比padding {length}：内边距，内容和边框之间的距离。默认值 0,不支持padding:10 5 15 20;写法。
padding可能写法：
padding: 30：四个方向内边距属性都是30rem。
paddingLeft:30：左内边距属性
paddingRight:30：右内边距属性
paddingTop:30：上内边距属性
paddingBottom:30：下内边距属性
margin {length}：外边距，元素和元素之间的空白距离。默认值 0,不支持margin:10 5 15 20;写法。
margin可能写法：
margin: 30：四个方向外边距属性都是30rem。
marginLeft:30：左外边距属性
marginRight:30：右外边距属性
marginTop:30：上外边距属性
marginBottom:30：下外边距属性
border {length}: 设定边框，border 目前不支持类似这样 border: 1 solid #ff0000; 的组合写法。
border可能写法：
borderRadius: 5：圆角，可以直接写数字，或者string,xxx | 'xxxrem'。
borderStyle: 'solid'：可选值solid | dotted| dashed。
borderWidth: 1：边框宽度，可以直接写数字，或者string,xxx | 'xxxrem'。
borderColor: 'navy'：边框颜色，支持预定义的颜色，和直接写颜色值，如'red' | '#666666'，颜色值不支持简写，如’#666’。
borderLeftWidth: 1：左边框宽度，可以直接写数字，或者string,xxx | 'xxxrem'。
borderRightWidth: 1：右边框宽度，可以直接写数字，或者string,xxx | 'xxxrem'。
borderTopWidth: 1：顶部边框宽度，可以直接写数字，或者string,xxx | 'xxxrem'。
borderBottomWidth: 1：底部边框宽度，可以直接写数字，或者string,xxx | 'xxxrem'。
borderRadius可能的写法：
borderBottomLeftRadius: 5：左下圆角，可以直接写数字，或者string,xxx | 'xxxrem'
borderBottomRightRadius: 5：左下圆角，可以直接写数字，或者string,xxx | 'xxxrem'
borderTopLeftRadius: 5：左上圆角，可以直接写数字，或者string,xxx | 'xxxrem'
borderTopRightRadius: 5：右上圆角，可以直接写数字，或者string,xxx | 'xxxrem'
QAP/Rax 布局模型基于 CSS Flexbox，以便所有页面元素的排版能够一致可预测，同时页面布局能适应各种设备或者屏幕尺寸。
Flexbox 包含 flex 容器和 flex 成员项。如果一个 QAP/Rax 元素可以容纳其他元素，那么它就成为 flex 容器。需要注意的是，flexbox 的老版规范相较新版有些出入，比如是否能支持 wrapping。这些都描述在 W3C 的工作草案中了，你需要注意下新老版本之间的不同。另外，老版本只在安卓 4.4 版以下得到支持。
在 QAP/Rax 中，Flexbox 是默认且唯一的布局模型，所以你不需要手动为元素添加 display: flex; 属性。
flexDirection
定义了 flex 容器中 flex 成员项的排列方向。可选值为 row | column，默认值为 column。
justifyContent
定义了 flex 容器中 flex 成员项在主轴方向上如何排列以处理空白部分。可选值为 flexStart | flexEnd | center | spaceBetween，默认值为 flexStart。
flexStart：是默认值，所有的 flex 成员项都排列在容器的前部；
flexEnd：则意味着成员项排列在容器的后部；
center：即中间对齐，成员项排列在容器中间、两边留白；
spaceBetween：表示两端对齐，空白均匀地填充到 flex 成员项之间。
alignItems
定义了 flex 容器中 flex 成员项在纵轴方向上如何排列以处理空白部分。可选值为 stretch | flexStart | center | flexEnd，默认值为 stretch。
stretch：是默认值，即拉伸高度至 flex 容器的大小；
flexStart：上对齐，所有的成员项排列在容器顶部；
flexEnd ： 下对齐，所有的成员项排列在容器底部；
center：中间对齐，所有成员项都垂直地居中显示。
flex 属性定义了 flex 成员项可以占用容器中剩余空间的大小。如果所有的成员项设置相同的值 flex: 1，它们将平均分配剩余空间. 如果一个成员项设置的值为 flex: 2，其它的成员项设置的值为 flex: 1，那么这个成员项所占用的剩余空间是其它成员项的2倍。
记不住flexbox 属性值和value? 我们为你提供速查样式库
QAP/Rax 支持 position 定位，用法与 CSS position 类似。为元素设置 position 后，可通过 top、right、bottom、left 四个属性设置元素坐标。
position {string}
设置定位类型。可选值为 relative | absolute | fixed | sticky，默认值为 relative。
relative：是默认值，指的是相对定位；
absolute：是绝对定位，以元素的容器作为参考系；
fixed：保证元素在页面窗口中的对应位置显示；
sticky：指的是仅当元素滚动到页面之外时，元素会固定在页面窗口的顶部。
top {number}：距离上方的偏移量，默认为 0。
bottom {number}：距离下方的偏移量，默认为 0。
left {number}：距离左方的偏移量，默认为 0。
right {number}：距离右方的偏移量，默认为 0。
opacity {number}：取值范围为 [0, 1] 区间。默认值是 1，即完全不透明；0 是完全透明；0.5 是 50% 的透明度。background-color {color}：设定元素的背景色，可选值为色值，支持RGB（ rgb(255, 0, 0) ）；RGBA（ rgba(255, 0, 0, 0.5) ）；十六进制（ #ff0000 ）；精简写法的十六进制（ #f00 ）；色值关键字（red），默认值是transparent 。更多颜色值请参考