关键词：
- 前端编码规范之：Git使用规范
- 前端编码规范之：样式（scss）编码规范
- 前端编码规范之：HTML结构规范
- 前端编码规范之：Vue最佳实践
- 前端编码规范之：Javascript编码规范
css/scss命名的原则是：通俗易懂，尽量保持不重复（冲突），尽量不要用id。
我比较推崇bootstrap的样式目录结构，class命名方式。推荐bootstrap样式框架的编码规范，同时结合BEM命名规范，灵活使用。
class 命名
-
class 名称中只能出现小写字符和破折号（dashe）（不是下划线，也不是驼峰命名法）。破折号应当用于相关 class 的命名（类似于命名空间）（例如，.btn 和 .btn-danger）。
- 避免过度任意的简写。.btn 代表 button，但是 .s 不能表达任何意思。
-
class 名称应当尽可能短，并且意义明确。
- 使用有意义的名称。使用有组织的或目的明确的名称，不要使用表现形式（presentational）的名称。
- 基于最近的父
class 或基本（base） class 作为新 class 的前缀。
- 使用
.js-* class 来标识行为（与样式相对），并且不要将这些 class 包含到 CSS 文件中。
- 在为 Sass 和 Less 变量命名是也可以参考上面列出的各项规范。
/* Bad example */
.t { ... }
.red { ... }
.header { ... }
/* Good example */
.tweet { ... }
.important { ... }
.tweet-header { ... }
代码组织
以组件为单位组织代码段。
制定一致的注释规范。
使用一致的空白符将代码分隔成块，这样利于扫描较大的文档。
如果使用了多个 CSS 文件，将其按照组件而非页面的形式分拆，因为页面会被重组，而组件只会被移动。
可以把bootstrap-sass目录结构 clone下来，研究一番。
什么是BEM
命名约定的模式如下：
.block{}
.block__element{}
.block--modifier{}
.block 代表了更高级别的抽象或组件。
.block__element 代表.block的后代，用于形成一个完整的.block的整体。
.block--modifier代表.block的不同状态或不同版本。
参考原文
BEM命名规范
BEM的关键是，可以获得更多的描述和更加清晰的结构，从其名字可以知道某个标记的含义。于是，通过查看 HTML 代码中的 class 属性，就能知道元素之间的关联。
BEM命名规范
思考
总的来说，BEM使用应该适量，适用于模块化的html结构。不能全篇使用，会导致class命名冗余。
我觉得应该避免出现出现这种方式,用预处理器拼接出来的class名称，会生成.article__body__xxx__xxx。在维护代码的时候，定位代码及其不方便。
规范也要进化，适合的才是最好的。
~而且，一般来说会使用通过 LESS/SASS 等预处理器语言来编写 CSS，利用其语言特性书写起来要简单很多。~
.article {
max-width: 1200px;
&__body {
padding: 20px;
}
&__button {
padding: 5px 8px;
&--primary {background: blue;}
&--success {background: green;}
}
}
airbnb前端规范之javascript编码规范
1引用1.1对所有的引用使用const，不要使用var。（这能确保你无法对引用重新赋值，也不会导致出现bug或难以理解）//badvara=1;varb=2;//goodconsta=1;constb=2;1.2如果一定需要可变动的引用，使用let代替var。（因为let是块级作用域，而var是... 查看详情
前端开发规范之jquery编码规范
加载jQuery在您的页面中优先使用CDN的方式，CDN方式的优点在这里，这里有比较流行的jQueryCDN列表清单（由于国内goolge限制问题，建议使用国内的CDN，例如百度的CDN）。[html] viewplaincopyprint? <script type="text/javascript" ... 查看详情
前端开发规范
这是一份旨在增强团队的开发协作，提高代码质量和打造开发基石的编码风格规范，其中包含了HTML,JavaScript和CSS/SCSS这几个部分。我们知道，当一个团队开始指定并实行编码规范的话，错误就会变得更加显而易... 查看详情
前端编码规范--css篇
合理的避免使用ID一般情况下ID不应该被应用于样式。ID的样式不能被复用并且每个页面中你只能使用一次ID。使用ID唯一有效的是确定网页或整个站点中的位置。尽管如此，你应该始终考虑使用class，而不是id，除非只使用一次另... 查看详情
前端读者|百度前端编码规范（css）
本文来自：百度FEX1前言CSS作为网页样式的描述语言，在百度一直有着广泛的应用。本文档的目标是使CSS代码风格保持一致，容易被理解和被维护。虽然本文档是针对CSS设计的，但是在使用各种CSS的预编译器(如less、sass、stylus等)... 查看详情
前端开发规范手册：基本原则
1、结构、样式、行为分离尽量确保文档和模版只包含HTML结构，样式都放到样式表中，行为都放到脚本里。 2、缩进统一两个空格缩进（总之缩进统一即可），不要使用Tab键或者Tab和空格混搭。 3、文件编码使用不带BO... 查看详情
编码规范-全
之前整理的编码规范比较零散，是时候整理一份完整的前端编码规范，include...html，css,jshtml篇1.结构（1）每个页面要写<!DOCTypehtml> ---告知页面渲染模式为标准模式；（2）特殊情况（避免闪屏）下，才在html中写style和script... 查看详情
前端编码风格规范——javascript规范
JavaScript规范全局命名空间污染与IIFE总是将代码包裹成一个IIFE(Immediately-InvokedFunctionExpression)，用以创建独立隔绝的定义域。这一举措可防止全局命名空间被污染。IIFE还可确保你的代码不会轻易被其它全局命名空间里的代码所修... 查看详情
前端编码规范--通用篇(代码片段)
前言本系列意在增强团队的开发协作，提高代码质量和打造开发基石的编码风格规范。我们知道，当一个团队开始指定并实行编码规范的话，错误就会变得更加显而易见。如果一段特定的代码不符合规范的话，它有可能只是代码... 查看详情
前端编码规范--html篇
文档类型推荐使用HTML5的文档类型申明：<!DOCTYPEhtml>（建议使用text/html格式的HTML。避免使用XHTML。XHTML以及它的属性，比如application/xhtml+xml在浏览器中的应用支持与优化空间都十分有限）。HTML中最好不要将无内容元素的标签... 查看详情
智能合约最佳实践之solidity编码规范
每一门语言都有其相应的编码规范，Solidity也一样，下面官方推荐的规范及我的总结，供大家参考，希望可以帮助大家写出更好规范的智能合约。##命名规范###避免使用小写的l，大写的I，大写的O应该避免在命名中单独出现，因... 查看详情
前端编码规范
以下为小组代码提交时git批注规范，请各位在提交代码时严格遵守，方便大家对工作代码追踪 提交git代码批注规范一、本人直接提交1、一般，提交代码要求功能任务完成便提交，除有依赖情况可提前提交2、... 查看详情
前端编码规范
以下为小组代码提交时git批注规范，请各位在提交代码时严格遵守，方便大家对工作代码追踪 提交git代码批注规范一、本人直接提交1、一般，提交代码要求功能任务完成便提交，除有依赖情况可提前提交2、... 查看详情
汇道科技：前端编码一定要注意的规范
当一个团队开始指定并实行编码规范的话，错误就会变得更加显而易见。这是因为一些程序员平常养成的编码不规范的小习惯导致的。如果一段特定的代码不符合规范的话，它有可能只是代码风格错误，而也有可能会是bug。... 查看详情
前端编码规范(代码片段)
最佳原则坚持制定好的代码规范。无论团队人数多少，代码应该同出一门。命名规则项目命名全部采用小写方式，以下划线分隔。例：my_project_name目录命名参照项目命名规则；有复数结构时，要采用复数命名法。例：scripts,styles,... 查看详情
智能合约最佳实践之solidity编码规范(代码片段)
每一门语言都有其相应的编码规范，Solidity也一样，下面官方推荐的规范及我的总结，供大家参考，希望可以帮助大家写出更好规范的智能合约。命名规范避免使用小写的l，大写的I，大写的O应该避免在命名中单独出现，因为很... 查看详情
编码规范之代码风格
1.缩进和空格 在书写代码的时候。必须注意代码的缩进规则： 使用4个空格作为缩进，而不使用tab缩进 变量赋值时，等号左右留出空格。 为了更大程度的减轻工作量，保持代... 查看详情
前端读者|百度前端编码规范（html）
本文来自：百度FEX1前言HTML作为描述网页结构的超文本标记语言，在百度一直有着广泛的应用。本文档的目标是使HTML代码风格保持一致，容易被理解和被维护。2代码风格2.1缩进与换行[强制]使用4个空格做为一个缩进层级，不允... 查看详情