浅谈编码规范
命名技巧
- 语义化标签优先
- 基于功能命名、基于内容命名、基于表现命名
- 简略、明了(翻译成英文)
- 所有命名都使用英文小写
- 命名用引号包裹
- 用中横线连接
CSS编码规范
- tab 用两个空格表示
- css的 :后加个空格, {前加个空格
- 每条声明后都加上分号
- CSS样式换行,而不是放到一行
- 颜色用小写,用缩写, #fff
- 小数不用写前缀, 0.5s -> .5s;0不用加单位
- 尽量缩写, margin: 5px 10px 5px 10px -> margin: 5px 10px
html编码规范
- 用两个空格来代替制表符(tab)
- 嵌套元素应当缩进一次(即两个空格)。
- 对于属性的定义,确保全部使用双引号,绝不要使用单引号。
4.不要在自闭合(self-closing)元素的尾部添加斜线 - 不要省略可选的结束标签(closing tag)(例如,</li>
或 </body>)
参考网站:
google html css编码规范
bootstrap 编码规范
Naming CSS Stuff Is Really Hard
垂直居中有几种实现方式,给出代码范例
- padding实现 外围盒子宽高由内部内容撑起来
- 定位实现水平垂直绝对居中 浏览器窗口可变,内部盒子宽高视内容可变
- line-height等于inline-block盒子高度 实现垂直居中
- vertical-align: middle于::before实现垂直居中 内部图片大小在一定范围可变即外围盒子可加载大小可变的图片
- display: table cell加上vertical-align:middle实现垂直居中
垂直居中1~3
垂直居中4~5