HTML规范文档

来源：互联网发布：top域名值得投资吗? 编辑：程序博客网时间：2024/06/05 13:32

前言

在日常工作中，为了将我们的代码进行统一有效的管理以及方便阅读。因此，有必要对我们得编码进行规范性要求。

$文档声明

首行声明，统一使用html5标准，

<!DOCTYPE html>

Note： <！DOCTYPE html>作用请参考：Doctype

$meta标签

根据项目需求,对meta标签进行调整删减，参考cool-head

<meta charset="UTF-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

Note： meta标签的作用：参考meta

$关键字与描述

描述一般不超过70字，关键字在5个以内

<meta name="description" content="sentence" /> <meta name="keywords" content="words.." />

$样式链接

<link rel="stylesheet" href="output/css/*.css"/>

$脚本链接

<script type="text/javascript" src="output/js/*.js"><script> // 统计代码的位置在离 <head/> 最近的位置 <script type="text/javascript"> //Google Baidu </script>

$书写规范

1.缩进使用4个空格(1个soft tab)
2.嵌套的节点必须缩进
3.文档中尽量不要使用&nbsp；,使用id进行缩进控制
4.在文档属性中使用双引号，不要使用单引号
5.为<img/>标签加上alt属性
6.为<label/>标签加上for属性
7.文档中，不同的id只允许出现一次
8.如果当前页面有动态数字或文字时，为其包裹上一个标签
9.标签有需要应用的数据时，为其添加data-*前缀的属性
10.当页面有需要使用到html特殊字符时，用转义符输出

$标签使用规范

< form/>标签的使用
使用异步方式提交数据时,避免存在无用的< form/>标签。
< h1/>标签的使用
文档中只可能出现一次h1标签。
< img/>标签的使用以及css背景设置
img标签使用环境：如用户头像，用户上传图片等具有上下文意义的图片，
其他情况，一律使用背景图片进行设置。
< label/>标签的使用
label标签应该和input配合使用，并且应该添加for属性进行指定。
行内元素与块级元素
内联元素不允许包含块级元素，不允许存在空的table,ul,ol标签，p标签不允许包含任何块级元素。

$注释规范

在模块的前后声明注释

<!-- module start --> <div class="mod mod-name">     ...... </div> <!-- module end --> <!-- header start --> <div class="header">     ...... </div> <!-- header end -->

阅读全文

0 0