html如何检验代码规范？？

代码规范性有两种方法：

1、在线检查：http://validator.w3.org/；

2、工具检查，例如：Html Validator。

Html Validator是Firefox的一个附加组件，以前看《精通CSS》提到的一些工具都因为不方便而没使用，每次都是在W3C在线验证查看代码是否规范。虽说过于追求标准有时没必要，但可能就因为有这种“标准癖”，没通过验证总觉得代码还是有问题。这个扩展真是解决了我不少问题。

Html Validator验证起来很方便。本地验证速度比W3C的在线网页要快很多，页面打开就能查看存在多少个问题，几处错误几处警告都一目了然。

它的验证方式有3种：HTML 、Tidy、SGML解析器和连续。前两种分别适合HTML和XHTML的验证，第三种为两种模式各验证一遍。

组件的概念

组件，是数据和方法的一个封装，其定义了一个可重用的软件元素的功能，展示和使用，通常表现为一个或一组可重用的元素。

组件的特性

可拓展性：既然组件是针对某一特定功能或需求开发的，那它就必须易于开发和拓展；

封装性：组件作为一个独立整体供使用，应该是对内修改，对外封闭，只供使用，而不对使用环境产生副作用；

易用性：组件的目的是产生可重用的独立部件，那就必须提供一种简单快捷的方式供使用。

Web Components特征

Web Components 将一系列特性加入 HTML 和 DOM 规范，使得开发者可以自由创建在web应用或文档可重用的元素或部件，其由四部分组成：

HTML模板 （HTML Templates） ：HTML内的DOM模板，在 <template>元素内声明。

影子DOM （Shadow DOM） ：组合对DOM和样式的封装；

HTML导入 （HTML Imports） ：定义在文档中导入其他HTML文档的方式；

自定义元素 （Custom Elements） ：定义新 HTML 元素的一系列API；

HTML模板

影子DOM（Shadow DOM）

DOM，即文档对象模型，是HTML文档的一个结构表示，以树形结构表示一个文档，文档中元素间关系按照父子，兄弟关系排列；DOM规范提供一系列API支持我们 *** 作文档节点，即通常所说的DOM API。

前面提到 Web Components 指封装DOM和样式，以组件的形式在文档中使用，而不同于 JavaScript 中函数会形成一个单独作用域，文档DOM树的层次结构中是不存在局部作用域概念的，也就是说文档内所有定义的样式都对整个文档产生影响，文档中的样式也会影响组件内的声明样式，而不限定于元素所处位置，这样显然极大阻碍了组件的独立性和可重用性，是必须要解决的问题，不过不用担心，这都已经解决了，解决方案就是下文介绍的 attachShadow() 方法。

影子DOM API提供了 attachShadow() 方法，创建一个影子DOM，支持将封装的内容或组件作为一个独立DOM子树附加进一个HTML文档，组件内与外部隔离，样式互不影响，这也印证了组件开发的封装性需求。

创建

要创建一个影子DOM，很简单，使用 attachShadow() 方法即可，而需要注意的是所有影子DOM必须和一个文档中存在的元素（HTML内置元素或自定义元素）绑定，才能使用：

影子树 （SHADOW TREE） 与影子主体 （SHADOW HOST）

上文使用attachShadow()方法创建的元素就是一个影子DOM，而其子内容就构成一棵影子树（shadow tree），而和影子DOM绑定，也就是包含该树的文档内元素通常称为影子主体（shadow host）。

template 槽位（SLOT）

使用：

渲染结果:

命名槽

渲染结果

样式

Web Components定义的组件内的样式与外部环境的样式是互不影响的，那么如何为组件设置样式呢，依然使用<style>标签：

HTML引入 （HTML Imports）

自定义元素（Custom Elements）

自定义元素支持开发者定义一类新HTML元素，声明其行为和样式，自定义元素分两类：

自定义标签元素 （Autonomous custom elements） ：完全独立于原始HTML元素标签的新标签元素，其所有行为需要开发者定义

自定义内置元素 （Customized built-in） ：基于HTML原始元素标签的自定义元素，以便于使用原始元素的特性，开发者只需要定义拓展行为；

创建自定义标签元素

为了创建一个自定义标签元素，我们需要继承HTMLELement类, 如在很多页面我们经常会有一键回到页面顶部功能，我们创建一个返回顶部的组件：

生命周期函数github example:

https://github.com/mdn/web-components-examples/tree/master/life-cycle-callbacks

在需要使用该组件的页面只需像使用正常HTML元素一样：

该元素的一切样式，行为，事件监听，默认行为均需要开发者自行定义

使用

html是什么意思？

html是超文本标记语言。

超文本标记语言，标准通用标记语言下的一个应用。 “超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。 超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。

HTML是一种规范，一种标准，它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）。浏览器按顺序阅读网页文件，然后根据标记符解释和显示其标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是，对于不同的浏览器，对同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果。

标记语言

HTML之所以称为超文本标记语言，是因为文本中包含了所谓“超级链接”点------就是一种URL指针，通过激活（点击）它，可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。

由此可见，网页的本质就是HTML，通过结合使用其他的Web技术（如：脚本语言、CGI、组件等），可以创造出功能强大的网页。因而，HTML是Web编程的基础，也就是说万维网是建立在超文本基础之上的。

---