语法

缩排使用soft tab(4个空格)。嵌套节点需要缩进。在属性中使用双引号,而不是单引号。属性名称全部为小写,并使用中间破折号作为分隔符。不要在自动结束标签的末尾使用斜线(HTML5规范表示可选)。选择性结束标签(例如:DOCTYPE html

Html

头(电影)

TitlePage title/title

/head

Body img src=' imageAlt='公司'

H1class=' hello-world' hello,world!/h1

/body

在/htmlHTML5 doctype页面的开头使用此简单的doctype,可以激活标准模式,以便在每个浏览器中尽可能一致地显示。Doctype不区分大小写,但通常doctype是大写的(html属性中的大写或小写)。DOCTYPE html html./html lang属性必须根据HTML5规范将lang属性添加到html标签中。这样有助于语音工具和翻译工具,告诉你如何发音和翻译。

此处提供了Lang属性的详细说明。语言列表可以在sitepoint上找到。

但是sitepoint只是语言的一大类。例如,汉语只给zh,但不区分香港、台湾和大陆。Microsoft提供了更详细的语言列表aspx,其中包括zh-cn、zh-hk和zh-tw的细分。Doctype html html lang=' en-us '/html字符编码声明了明确的字符编码,使浏览器可以轻松快速地确定适合web内容的呈现方法。通常指定为' UTF-8 'doctype html html head meta charset=' utf-8 '/head.您可以使用/html IE兼容模式meta标签指定要呈现页面的IE版本。doctype html html head meta http-equiv=' x-ua-compatible ' content=' ie=edge '/head./html简介HTML5规范链接使用链接

使用Style

使用脚本!-external CSS-link rel=' style sheet ' href=' code _ guide . CSS '-in-document CSS-style./style!-external js-script src=' code _ guide . js '/script!-in-document js-script./script属性顺序属性必须以特定顺序出现,以确保可读性。

Classidnamedata-* src、for、type、href、value、max-length、max、min、pattern placeholder、ttern

Id应该更具体,尽量少用,所以请放在第二位。

A class=' 'id=' 'data-modal=' toggle ' href=' # ' example link/a

input class=' form-control ' type=' text '

Img src=' 'alt=' '

Boolean属性

布尔属性表示不需要声明值的属性。XHTML需要每个属性声明值,但HTML5不需要。

有关详细信息,请参见whatwg section on boolean attributes。

如果布尔属性存在,则值为true如果不存在,则值为false。

Input type='text' disabled

input type=' checkbox ' value=' 1 ' checked

Select

option value=' 1 ' selected 1/option

/select

JS构建标记

在JS文件中生成标记会使内容更难找到、更难编辑、性能更差。要尽量避免这种情况的出现。

减少标签数量

编写HTML代码时,应避免不必要的父节点。为了减少HTML,经常需要通过迭代和重组来减少HTML。

!-not well –

Span class='avatar '

Img src=' '

/span

!-贝特-

Img class='avatar' src=' '

实用性高于完美

尽可能遵循HTML标准和含义,但不能以浪费实用性为代价。无论何时,都要以最低的复杂性和最低的标签解决问题。

相关推荐