前端布局规范细则

一、命名规范:

1、基本要求:

1)文件编码统一使用 UTF-8 编码;
2)命名时以符合语义为主要参考指标,CSS属性书写规范,采用统一风格及命名方法;
3)结构清晰,层级关系明朗,以不超过三级为标准;
4)同一表现形式的样式要求可重复利用,模块组件类的样式要求可整体外部移植;
5)编写 CSS 的时候,应当避免使用CSS Hack,能不用则不用。
6)所有页面默认都针对Firefox 等最接近标准的浏览器进行设计,然后使用 IE 特有条件注释功能进行针对性修正。
7)请使用英文进行命名,尽量避免使用拼音。命名要求具有可读性,尽量避免使用缩写。命名虽然允许数字,但应尽量避免使用数字命名。
2、命名方法 要求采用统一的命名方法。常用命名方法有:
1)连写式命名法,如:helloworld
2)中线命名法,如:hello-world(目前采用此方法的较多,建议采用)
3)下划线命名法,如:hello_world
4)骆驼命名法,如:helloWorld
5)帕斯卡命名法,如:HelloWorld
6)其他方法。
3、样式文件命名规范 如:
全局的:global.css
主要的:master.css
布局、版面:layout.css
专栏:columns.css
文字:font.css
打印样式:print.css
主题:themes.css
补丁:pacth.css
格式化浏览器:base.css等。
4、ID及Class命名常用名称
页头:header
登录条:login-bar
标志:logo
侧栏:side-bar
广告:banner
导航:nav
子导航:sub-nav
菜单:menu
子菜单:sub-menu
搜索:search
滚动:scroll
页面主体:main
内容:content
标签页:tab
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
加入:joinus
指南:guild
服务:service
热点:hot
新闻:news
下载:download
注册:regsiter
状态:status
按钮:btn
投票:vote
合作伙伴:partner
友情链接:friendlink
版权:copyright
外套:wrap
页脚:footer
标题:title
顶导航:top-nav(mini-nav)

html前端命名规则相关推荐

  1. Web前端第三季(JavaScript):三:第1章:JavaScript基本知识:107-js中变量的声明+108-js中变量的注意事项+109-js中变量的命名规则+110-赋值和算术运算符

    目录 一.目的 1.想:学习前端知识 2.想:记录笔记,下次不用看视频,直接看笔记就可以快速回忆. 二.参考 1.我自己代码的GitHub网址 2.SIKI学院:我参考此视频实操 3.w3school ...

  2. 前端:JS/16/JavaScript简介,lt;script标记,常用的两个客户端输出方法,JS注释,JS变量(声明,命名规则,赋值),变量的数据类型(数值型,字符型)

    JavaScript简介 1,JavaScript是什么? JavaScript是一种小型的,轻量级的,面向对象的,跨平台的客户端脚本语言. JavaScript是嵌入到浏览器软件当中去的,只要你的电 ...

  3. Web前端开发规范 : 文件命名规则

    转自 : https://blog.csdn.net/qq_26129689/article/details/52652000?ref=myread 1.文件命名规则 1.1文件名称的命名规则 统一用 ...

  4. 修改title样式_css常见样式命名规则

    前言 也许你曾经看到过很多样式命名规则,也参考了我们制定的命名规范,但是大部分的具体样式还是不知道如何命名,主要思想或者标准是什么,也就是前面.m-panel-后面的应该如何命名,子模块与父模块依赖关 ...

  5. CPU : Intel CPU命名规则

                                                                        台式机处理器 1.Celeron    Celeron系列都直接 ...

  6. [转载] Python学习系列之下划线与变量命名规则

    参考链接: Python中的命名空间和范围 一.定义 1.1 从入口函数谈起 从其他语言比如C++和Java,转到Python的同学经常遇到这个问题,入口函数是什么?Python如何执行? 后来我们发 ...

  7. 英特尔服务器级cpu型号含义,新手必看 英特尔移动CPU命名规则解析

    近日,在ZOL论坛,一位名叫"稻草人2008"的网友为我们分享了英特尔移动CPU命名规则解析,下面与大家分享一下: 虽然现在"频率至上"论已经被抛进了垃圾箱,但 ...

  8. python怎么打下划线符号_详解 Python 中的下划线命名规则

    在 python 中,下划线命名规则往往令初学者相当 疑惑:单下划线.双下划线.双下划线还分前后--那它们的作用与使用场景 到底有何区别呢?今天 就来聊聊这个话题. 1.单下划线(_) 通常情况下,单 ...

  9. dw中css目标规则命名,css 常用样式命名规则

    大家在写css的时候,对一些html标签起一个合适的名字是个很头疼的事情,现在给大家分享项目中常用的名字供参考. 外套:wrap  --用于最外层 头部:header  --用于头部 主要内容:mai ...

  10. 华硕系列笔记本命名规则以及各型号的差别特点

    <script type="text/javascript"></script><script type="text/javascript& ...

最新文章

  1. HDU1548:A strange lift(Dijkstra或BFS)
  2. centos7在分区上建立文件系统和挂载
  3. 计算机网络职称可以免考么,谁知道四川职称计算机考试的免考条件啊,我要去评职称,但不想去考职? 爱问知识人...
  4. VsCode从零开始配置一个属于自己的Vue开发环境
  5. java 属性访问修饰符_Java中的访问修饰符(二十七)
  6. 单片机实现水位控制C语言,单片机课程设计 水位自动控制.doc
  7. 4.线性和卷积——边界问题、解决边界方法和Matlab实战_3
  8. ajax内调用WCF服务
  9. 前端优化,包括css,jss,img,cookie
  10. 无根树的Prufer序列
  11. 离散时间傅里叶变换(DTFT)与离散傅里叶级数(DFS)
  12. python模拟用户登录代码_Python模拟用户自动登陆网易126邮箱源码详解
  13. 实现支付宝AR扫描动画效果
  14. 卧槽,GitHub 开源了一个看片神器!
  15. X509证书认证原理
  16. 学习四旋翼(三):DMP姿态解算和串级PID控制姿态
  17. catia如何画花键_CATIA花键绘制万向节的装配及螺纹绘制
  18. 分布式事务概述 (资料)
  19. python中selenium(模拟登陆)+pytesseract(自动识别验证码)应用例子之查询住房公积金
  20. 类脑计算机能解决,全球神经元规模最大类脑计算机问世

热门文章

  1. vbs定时自动发送qq消息
  2. 防火墙 firewall 及端口查看
  3. reviewboard mysql_Ubuntu下ReviewBoard安装全过程_MySQL
  4. java中jpg转png_java 图片格式转换(pngjpg) 截图
  5. 百度离线地图示例之一:地图展示
  6. ActiveSync 无法同步解决记录
  7. 万能五笔-98五笔方案
  8. linux飞信机器人,在Nagios使用飞信机器人发送警报
  9. 木马 java_Java恶意软件来袭 木马病毒也要跨平台
  10. 对联广告php代码,JS实现很实用的对联广告代码(可自适应高度)