本文章没有找到对应的语言版本
HTML

Style

  1. 始终声明文档类型
<!DOCTYPE html>
  1. 使用小写元素名称
<!-- true -->
<div></div>

<!-- false -->
<DIV></DIV>
  1. 闭合所有HTML元素
<!-- true -->
<div></div>

<!-- false -->
<div>
  1. 使用小写属性名称
<!-- true -->
<div class="foo"></div>

<!-- false -->
<div CLASS="foo"></div>
  1. 始终为属性值添加引号
<!-- true -->
<div class="foo"></div>

<!-- false -->
<div class=foo></div>
  1. 始终为图片指定 alt、width 和 height 属性
<!--- true -->
<img src="foo.jpg" alt="Foo" width="100" height="100">

<!--- false -->
<img src="foo.jpg">
  1. 等号两边不要有空格
<!-- true -->
<div class="foo"></div>

<!-- false -->
<div class = "foo"></div>
  1. 避免过长的代码行
  2. 若无特殊需要，不应随意添加空行、空格或缩进。
    • 可使用空行分隔大型代码块或逻辑模块
    • 建议采用2个空格作为缩进单位（禁止使用 Tab 键）
<!-- true -->
<body>

<h1></h1>

<p></p>

</body>

<!-- false -->
<body>
<h1></h1><p></p>
</body>
  1. 切勿省略 <title> 元素
  2. 始终添加 lang 属性
  3. 定义元数据-字符编码-<meta charset="charset">
  4. 设置视口元数据-<meta name="viewport" content="width=device-width, initial-scale=1.0">
  5. HTML 注释规范
    • 短注释应保持单行格式
    • 长注释应保持多行格式
<!-- 短注释 -->

<!-- 
  长注释
  多行注释 
-->
  1. 链接样式表时应采用简洁语法
<!-- 正确 -->
<link rel="stylesheet" href="style.css">

<!-- 错误 -->
<link rel="stylesheet" href="style.css" type="text/css">
  1. CSS 代码格式规范
    • 短规则可压缩书写
    • 长规则应保持多行格式
    • 左花括号与选择器保持同行
    • 左花括号前保留一个空格
    • 使用两个空格进行缩进
    • 每个属性值对（包括末行）均以分号结尾
    • 仅当值包含空格时添加引号
    • 右花括号单独成行且不前置空格
/* 短规则 */
p.intro {font-family:Verdana;font-size:16em;}

/* 长规则 */
body {
    background-color: lightgrey;
    font-family: "Arial Black", Helvetica, sans-serif;
    font-size: 16em;
    color: black;
}
  1. 引入外部脚本时应采用简洁语法
<!-- 正确 -->
<script src="script.js"></script>

<!-- 错误 -->
<script type="text/javascript" src="script.js"></script>
  1. 统一使用小写文件名