💡 Tips：项目开发需要定义书写规范，保证项目成员编写代码规范性，一致性。以下示例都采用 Less 扩展语言演示

1、类名规范：清晰明了，尽量保持类名唯一性，使用两到三个完整单词，采用中划线拼接

/* 正确示例 */
.order-list-page {.header-navbar {/* 此处写样式 */}
}/* 错误示例 */
.text {}
div,span {}

2、样式嵌套不要太深，以两到三层为最佳，否则影响查找性能

/* 正确示例 */
.header-navbar {.header-navbar-left {}.header-navbar-right {}
}/* 错误示例 */
.userPage {.main-box {.formBox {// ...}}
}

3、抽离公共样式文件，抽离公共变量

/* 公共变量文件 */
@blue: #007aff;
@borderColor: #ccc;
@errorColor: #f00;
// ...@pm: 12px;
@2pm: 24px;
@boldBorder: 3px;
// ...

4、添加 scoped 作用域限制，避免样式全局污染

<style lang="less" scoped></style>