CSS 是描述 xhsml 的样式语言。支持 CSS 的属性。 在此基础上，做了一些编译支持：
对于自适应的单位，推荐使用 CSS3 vw 为单位，vw 代表视窗( Viewport )的宽度为 1%； 同时也支持 rpx，规定屏幕宽为 750rpx。在 iPhone X 上，屏幕宽度为 375px，共有 750 个物理像素，则 750rpx = 375px = 750 物理像素，1rpx = 0.5px = 1 物理像素。
设备 | rpx 换算 px（屏幕宽度 / 750） | px 换算 rpx（750 / 屏幕宽度） |
|---|---|---|
| iPhone5 | 1rpx = 0.42px | 1px = 2.34rpx |
| iPhone6 | 1rpx = 0.5px | 1px = 2rpx |
| iPhone6 Plus | 1rpx = 0.552px | 1px = 1.81rpx |
为了工程化和代码复用，我们支持 @import 语句，导入 CSS 文件。
/* header.css */
.header {
padding: 8px;
}
/* index.css */
@import "header.css";
.body {
padding: 12px;
}
内联样式与 Web 开发一致,且支持动态更新
<view style="color: {{eleColor}}; font-size: {{eleFontsize}}"> xhsml </view>
权重越高越优先。在优先级相同的情况下，后设置的样式优先级高于先设置的样式。
view {
// 权重为 1
color: blue;
}
.ele {
// 权重为 10
color: red;
}
#ele {
// 权重为 100
color: pink;
}
view#ele {
// 权重为 1 + 100 = 101，优先级最高，元素颜色为orange
color: orange;
}
view.ele {
// 权重为 1 + 10 = 11
color: green;
}
定义在 app.css 中的样式为全局样式，作用于每一个页面。在 page 的 css 文件中定义的样式为局部样式，只作用在对应的页面，并会覆盖 app.css 中相同的选择器。