强迫症 代码对齐 html css js

 

经常写html，css和js(基本上都是jquery)，慢慢的养成习惯，有了一套自己喜欢的代码对齐方式，看起来也满整齐。

html：

关于html，对齐方式基本相同，子元素缩进就可以了，如图：

 

 

css：

很多人喜欢把css写在一行，整体看一行一行的似乎满整齐，其实看起来很费劲，如果真要在乎那几KB的文件大小的话，完全可以用工具格式化压缩，自己看着方便清晰才好。

书写规则：

1. 单属性成行，如图：

 

 

2.多属性成列，如图：

 

 

3.层级选择器成行，如上两图

 

4.多选择器成列，如图：

 

 

5.每组之间空一行分割，如图：

 

 

6.多选择器单独设置单属性，或css-sprite，公用与单设之间空一行分割，单设不空行，如图：

 

 

js：

主要是jquery缩进，js缩进大致都相同。适当添加注释，有利于阅读。

书写规则：

若方法多余两个或三个，选择语句自成一行，每个方法换行缩进，若此方法改变了选择语句，则之后的方法再次缩进，每个方法以.开头。如图：