前端代码规范与流程开发

2021年5月5日 0 条评论 30 次阅读 1 人点赞

代码规范

  1. 类名语义化,尽量精短、明确,必须以字母开头命名,且全部字母为小写,单词之间统一使用下划线“_” 连接
  2. 类名嵌套层次尽量不超过三层
  3. 尽量避免直接使用元素选择器
  4. 属性书写顺序
    布局定位属性:display / position / float / clear / visibility / overflow
    尺寸属性:width / height / margin / padding / border / background
    文本属性:color / font / text-decoration / text-align / vertical-align
    其他属性(CSS3):content / cursor / border-radius / box-shadow / text-shadow
  5. 避免使用id选择器
  6. 避免使用通配符*和!important

目录规范

项目文件夹:XXXXX

  • 样式文件夹:css
  • 业务类图片文件夹:images
  • 样式类图片文件夹: icons
  • 字体类文件夹: fonts

流程开发

蓝湖/摹客协作平台

  • UI设计师 psd效果图完成后,会上传到蓝湖//摹客里面,同时会拉前端工程师进入开发
  • 大部分情况下,UI会把图片按照前端设计要求给切好
  • 前端设计师可以直接/摹客/蓝湖测量取值

阿里图标库

适配方案(施工中)

  • flex 布局
  • 百分比布局
  • rem布局
  • vw/vh布局
  • 响应式布局

移动端页面

小程序

Master

Master

这个人太懒什么东西都没留下

文章评论(0)