当前位置:Gxlcms > html代码 > html命名规范的详细介绍

html命名规范的详细介绍

时间:2021-07-01 10:21:17 帮助过:15人阅读

前面的话

  由历史原因及个人习惯引起的 DOM 结构、命名不统一,导致不同成员在维护同一页面时,效率低下,迭代、维护成本极高。所以,使用统一的命名规范非常必要。本文将详细介绍命名规范

目录命名

  1、项目文件夹:projectname

  2、样式文件夹:css

  3、脚本文件夹:js

  4、样式类图片文件夹:img

图片命名

  图片命名建议以以下顺序命名:

  (m_)图片功能类别(必选)+ 图片模块名称(可选) + 图片精度(可选)

  m_表示是否公共,可选

【图片功能类别】

  icon:模块类固化的图标

  logo:LOGO类

  spr:单页面各种元素合并集合

  btn:按钮

  bg:可平铺或者大背景

  pic :表示当前内容或业务的图片

【图片模块名称】

  goodslist:商品列表

  goodsinfo:商品信息

  userportrait:用户头像

【图片精度】

  普清:@1x

  Retina:@2x | @3x

//公共模块:
m_btn_goodlist@2x.png
m_btn_goodlist.png

//非公共模块:
wx_btn_goodlist@2x.png
wx_btn_goodlist.png
btn_goodlist.png

文件命名

  确保文件命名总是以字母开头而不是数字,且字母一律小写,以下划线连接且不带其他标点符号,如

<!-- HTML -->
connect.html
connect_list.html
connect_detail.html
<!-- SASS -->
connect.scss
connect_list.scss
connect_detail.scss

以上就是html命名规范的详细介绍的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行