#样式方案

自适应样式单位 rpx，自动根据设备环境缩放。

关系：750rpx = 100vw

绝对样式单位 px，在所有设备下表现一致。

#样式文件

对于页面和组件级的样式，推荐使用 CSS Modules 的方案，能有效避免样式冲突问题。

规范规则如下：

• 文件名： xxx.module.[css|less]
• 模块化：一个页面或组件对应一个样式文件。

Home
├── index.module.css
└── index.tsx

#样式规则

推荐使用驼峰式命名样式名，同时避免使用嵌套样式名。

推荐写法：

// Good
.home {
  color: red;
}

.homeTitle {
  font-size: 48rpx;
}

不推荐写法：

// Bad
.home {
  color: red;
  .title {
    font-size: 48rpx;
  }
}

#设计稿

设计稿应以 750px 为设计宽度，能有效减少开发过程中单位的转换换算。