语法

  • 缩进使用soft tab(2个空格);
  • 嵌套的节点应该缩进;
  • 在属性上,使用双引号,不要使用单引号;
  • 属性名全小写,用中划线做分隔符;
  • 不要在自动闭合标签结尾处使用斜线;

DOCTYPE声明

HTML文件必须加上 DOCTYPE 声明,并统一使用 HTML5 的文档声明:
<!DOCTYPE html>

页面语言LANG

应在html标签上加上lang属性。这会给语音工具和翻译工具帮助,告诉它们应当怎么去发音和翻译。

推荐使用属性值 cmn-Hans-CN(简体, 中国大陆),但是考虑浏览器和操作系统的兼容性,目前仍然使用 zh-CN 属性值 <html lang="zh-CN">

IE兼容模式

不同doctype在不同浏览器下会触发不同的渲染模式

<meta http-equiv="X-UA-Compatible" content="IE=Edge">

CHARSET

一般情况下统一使用 “UTF-8” 编码,请尽量统一写成标准的 “UTF-8”,不要写成 “utf-8” 或 “utf8” 或 “UTF8”。 <meta charset="UTF-8">

元素属性

元素属性值使用双引号语法

<input name="name" type="text" checked="checked">

HTML代码大小写

HTML标签名、类名、标签属性和大部分属性值统一用小写,HTML文本、CDATA、JavaScript、meta标签某些属性等内容可大小写混合

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>  
<!-- HTML文本内容 -->  
<h1>I AM WHAT I AM </h1>  
<!-- JavaScript 内容 -->  
<script type="text/javascript">  
    var demoName = 'demoName';
    ...
</script>

<!-- CDATA 内容 -->  
<script type="text/javascript"><![CDATA[  
...
]]></script>

引入CSS, JS

根据HTML5规范, 通常在引入CSS和JS时不需要指明 type,因为 text/css和 text/javascript 分别是他们的默认值。

<!-- External CSS -->  
<link rel="stylesheet" href="code_guide.css">

<!-- In-document CSS -->  
<style>  
    ...
</style>

<!-- External JS -->  
<script src="code_guide.js"></script>

<!-- In-document JS -->  
<script>  
    ...
</script>  

扫描二维码,分享此文章

郭德臣