美文网首页
组件开发规范

组件开发规范

作者: 团子Secret | 来源:发表于2018-08-04 16:42 被阅读0次

css命名规范

基本命名

  • 类名中,不同单词间使用短横线连接,例如: yi-nav
  • 在确保准确描述该类的情况下,尽可能的让类名简短

公用变量命名 $--cat-变量名-修饰符

公有变量: 颜色,文字大小,圆角...
变量名直接采用css的属性

$--cat-color-blue: #18A2EA
$--cat-font-size-base: 14px;
$--cat-font-size-small: $--cat-font-size-base * 10%

组件中类命名 .cat-组件名-修饰符

.cat-button-text {

}
.cat-button-header {

}

css书写规范

  • 变量名与{ 之间用一个空格隔开
.yi-nav { 

}
  • : 与属性值 之间用一个空格隔开
 font-siize: 14px;
  • color的属性值采用16进制的写法,字母大写(同蓝湖直接复制下来的格式)
color: #18A2EA

组件使用规范

  • 绑定变量名放在前面
    参数值类型依次为: Boolean,Object, Array, String, Function
  • 绑定方法放在后面

相关文章

  • VueJs前端开发规范

    ## VUEJS开发规范 ## 1. 基于组件化开发理解 2. 组件命名规范 3. 结构化规范 4. 注释规范 5...

  • Vue-基础语法(三)

    组件化开发 一、组件概念组件化规范:Web Components 浏览器支持不好,vue 实现了这个规范https...

  • 组件开发规范

    css命名规范 基本命名 类名中,不同单词间使用短横线连接,例如: yi-nav 在确保准确描述该类的情况下,尽可...

  • vue开发组件设置*.vue文件模板

    title: vue组件开发模板date: 2016-11-21 开发模板 规范 本文介绍vue组件开发的模板,在...

  • react组件开发规范

    这是通过修改项目运行在Google上时的警告,总结的的部分react组件开发规范: (1)编写组件时,一定要写Pr...

  • Swift 组件开发规范

    [TOC] 最近在公司内部写了一些 Swift 相关组件的一些思考 Swift 组件开发规范 1. 工程规范 1....

  • 组件化开发

    组件化开发思想 标准 分治 重用 组合组件开发规范:Web Components通过封装好功能的定制元素(自定义标...

  • 前端工程涉及八个比较大的分类:

    组织架构:前端开发规范和架构设计,包括模块化/组件化开发模型、开发框架、目录规范、组织形式等。 工程部署:有关前端...

  • css BEM书写规范

    [规范]css BEM书写规范 BEM是基于组件的web开发方法。其思想是将用户界面分隔为独立的块,从而使开发复杂...

  • 小程序flex布局

    小程序开发规范 在学习小程序时,规范是特别重要的。 目录的规范,所有组件要放在components目录下,所有图片...

网友评论

      本文标题:组件开发规范

      本文链接:https://www.haomeiwen.com/subject/kfhmvftx.html