嗯……关于HTML5

来源：蜘蛛抓取(WebSpider) 时间：2018-09-12 09:42 标签： html

在我还是个懵懂的青涩小青年的时候，貌似有股小小的W3C验证之风，随着HTML5开始家喻户晓，深入人心，我估计以后会有HTML5验证之类的小风潮。在国外，这类验证已经半热了，您对自己写的页面或是站点有兴趣试试HTML5方面的验证，可以使用，或者是。

这类验证的结果，例如出现的error等对于我们了解HTML的规范，知道HTML5中一些被遗弃的特征还是有些帮助的。

一、不再有“过时”这类说法

可能有些开发人员听过“这个标签过时了”类似这样的说法，指的是一些元素或是特征属性在当前HTML草案下是不合法滴，或者说是不再是当前HTML草案的一部分。但是，这种说法，只会出现在当前的HTML中，HTML5有着海纳百川的胸襟，许多在当前HTML中被当做恶徒的人在他那里都是有可取之处的家伙。

举个例子吧，如果你使用XHTML严格文档模型验证一个文档页面，同时这个页面中有<iframe>元素和target属性，那么验证的结果就会出现两个华丽丽的错误，如下截图：

这在HTML5中已经彻底改头换面了。因为诸如<iframe>元素和target属性在HTML5都是合法公民，所以如果是在HTML5模式下验证的话是不会有任何错误或警告的，一方通行。

有些特征在HTML5实际上已经被无情地抛弃了，但是依旧可以通过HTML5验证。如下截图：

上图是验证带有border属性的<img>元素和带有name属性的<a>元素的结果截图。这两个属性都在HTML5中退休了。

HTML5足够包容，因此，在HTML5验证器下，这个页面仍然是合法有效的，但是如果你使用其他方法来做同样的事情会收到警告。

如果你想查看完整“舍弃但靠谱”特征可以参见这里：。

另一方面，有些元素过于复古且错得比较离谱的话，不建议使用了。如果闲得蛋疼强制用这些元素的话，验证的时候，得到的就不是是个把不温不火的警告了，而是带有其他替代解决方法建议的比较成熟的错误提示了。

以及<blink>。如果你想一窥所有抛弃元素的庐山真面目，你可以参见这里：。

四、被舍弃的元素会把页面搞残吗？

通常来说，被舍弃的元素是不会把页面搞残的。HTML5的DOCTYPE并不是一个识别标记语言的DOCTYPE(文档类型)，它是一个识别网页文件的文档类型，不管它是旧主或类似的<section><nav>的新贵。所以你可以放心大胆地把老文档的文档类型改成HTML5的文档类型，而不用去担心页面会不会嗝屁或是有渲染差异。

另外，浏览器制造商都被要求需要支持那些过时的老标签。相关信息可以参见这里：，主要是告诉浏览器那些过时的标签早页面上究竟该如何渲染。

不过话又说过来，被“要求”是一回事，到底浏览器生产商是否是个乖乖听话的宝宝我们就不得而知了。不过，我个人感觉，大部分的浏览器生产商都会遵循规范来的，至于IE浏览器，我转过头看着阴沉的窗外，倒吸了口凉气——有点不放心。

不过，可以肯定的是把就文档模型改成HTML5是很OK的，不会有任何渲染的问题，反而可以大步跟随前言技术前进的潮流。相关内容可以参见我之前翻译的“”一文第一段落。

本文为原创文章，转载请注明来自[]

HTML5 是定义  标准的最新的版本。 该术语表示两个不同的概念：

  • 它是一个新版本的HTML语言，具有新的元素，属性和行为，
  • 它有更大的技术集，允许更多样化和强大的网站和应用程序。这个集合有时称为HTML5和朋友，通常缩写为HTML5。

设计为所有Open Web开发人员都可以使用，此引用页面链接到许多关于HTML5技术的资源，根据其功能分为几个组。

  • 语义：能够让你更恰当地描述你的内容是什么。
  • 连通性：能够让你和服务器之间通过创新的新技术方法进行通信。
  • 离线 & 存储：能够让网页在客户端本地存储数据以及更高效地离线运行。
  • 2D/3D 绘图 & 效果：提供了一个更加分化范围的呈现选择。
  • 性能 & 集成：提供了非常显著的性能优化和更有效的计算机硬件使用。
  • 设备访问 Device Access：能够处理各种输入和输出设备。
  • 样式设计: 让作者们来创作更加复杂的主题吧！

HTML5 中新的提纲和节段元素一览: ,
和 元素嵌入和允许操作新的多媒体内容。
看一下 HTML5 中对 web 表单的改进：强制验证 API，一些新的属性， 属性 的一些新值
除了节段，媒体和表单元素之外，还有众多的新元素，例如 ， ， ， ， ， ， ， 或者 和，这增加了的数量。
属性，作者们现在可以精确控制 元素的安全级别以及期望的渲染。
允许直接嵌入数学公式。
本文介绍了如何标示在网页设计或 Web 应用程序中使用 HTML5 时碰到的问题。
用于把 HTML5 文档的字节转换成 DOM 的解释器，已经被扩展了，并且现在精确地定义了在所有情况下使用的行为，甚至当碰到无效的 HTML 这种情况。这就导致了 HTML5 兼容的浏览器之间极大的可预测性和互操作性。

允许在页面和服务器之间建立持久连接并通过这种方法来交换非 HTML 数据。
允许服务器向客户端推送事件，而不是仅在响应客户端请求时服务器才能发送数据的传统范式。
这项技术，其中的 RTC 代表的是即时通信，允许连接到其他人，直接在浏览器中控制视频会议，而不需要一个插件或是外部的应用程序。

火狐全面支持 HTML5 离线资源规范。其他大多数针对离线资源仅提供了某种程度上的支持。
Firefox 3 支持 WHATWG 在线和离线事件，这可以让应用程序和扩展检测是否存在可用的网络连接，以及在连接建立和断开时能感知到。
客户端会话和持久化存储让 web 应用程序能够在客户端存储结构化数据。
是一个为了能够在浏览器中存储大量结构化数据，并且能够在这些数据上使用索引进行高性能检索的 Web 标准。
对新的 HTML5 文件 API 的支持已经被添加到 Gecko 中，从而使 Web 应用程序可以访问由用户选择的本地文件。这包括使用 元素的新的 属性针对多文件选择的支持。 还有 。

和 元素嵌入并支持新的多媒体内容的操作。
这项技术，其中的 RTC 代表的是即时通信，允许连接到其他人，在浏览器中直接控制视频会议，而不需要一个插件或是外部的应用程序。
允许使用，操作计算机摄像头，并从中存储图像。
  元素支持字幕和章节。 一个文本轨道格式。

元素以及如何在火狐中绘制图像和其他对象。
一个基于 XML 的可以直接嵌入到 HTML 中的矢量图像格式。

能够把 JavaScript 计算委托给后台线程，通过允许这些活动以防止使交互型事件变得缓慢。
允许异步读取页面的某些部分，允许其显示动态内容，根据时间和用户行为而有所不同。这是在 背后的技术。
新一代的 JavaScript 引擎功能更强大，性能更杰出。
允许对浏览器历史记录进行操作。这对于那些交互地加载新信息的页面尤其有用。
HTML5 已经把 contentEditable 属性标准化了。了解更多关于这个特性的内容。
HTML5 的拖放 API 能够支持在网站内部和网站之间拖放项目。同时也提供了一个更简单的供扩展和基于 Mozilla 的应用程序使用的 API。
允许控制动画渲染以获得更优性能。
为一个网页或者应用程序控制使用整个屏幕，而不显示浏览器界面。
允许锁定到内容的指针，这样游戏或者类似的应用程序在指针到达窗口限制时也不会失去焦点。
为了构建一个良好的具有离线功能的 web 应用程序，你需要知道什么时候你的应用程序确实离线了。顺便提一句，在你的应用程序又再回到在线状态时你也需要知道。

允许使用和操作计算机的摄像头，并从中存取照片。
对用户按下触控屏的事件做出反应的处理程序。
让浏览器使用地理位置服务定位用户的位置。
让用户在运行浏览器的设备变更方向时能够得到信息。这可以被用作一种输入设备（例如制作能够对设备位置做出反应的游戏）或者使页面的布局跟屏幕的方向相适应（横向或纵向）。
允许锁定到内容的指针，这样游戏或者类似的应用程序在指针到达窗口限制时也不会失去焦点。

已经扩展到能够以一个更加复杂的方法给元素设置样式。这通常被称为 , 尽管 CSS 已经不再是很难触动的规范，并且不同的模块并不全部位于 level 3：其中一些位于 level 1 而另一些位于 level 4，覆盖了所有中间的层次。

现在可以使用 给逻辑框设置一个阴影，而且还可以设置 。
现在不仅可以使用图像来格式化边框，使用 和它关联的普通属性，而且可以通过 属性来支持圆角边框。
使用 以在不同的状态间设置动画，或者使用 在页面的某些部分设置动画而不需要一个触发事件，你现在可以在页面中控制移动元素了。
作者们如今有更强大的能力来使自己的网页文字达到更佳的排版。他们不但可以控制 和 ， 还可以给它设置一个 或者更精细地控制它的 。感谢新的 规则，现在我们可以下载并应用自定义的字体了。
为了提高设计的灵活性，已经有两种新的布局被添加了进来：, 以及 。

    HTML5 的新的表单属性

    min、max 和 step 属性用于为包含数字或日期的 input 类型规定限定（约束）。

    max 属性规定输入域所允许的最大值。

    min 属性规定输入域所允许的最小值。

    step 属性为输入域规定合法的数字间隔（如果 step="3"，则合法的数是 -3,0,3,6 等）。

    下面的例子显示一个数字域，该域接受介于 0 到 10 之间的值，且步进为 3（即合法的值为 0、3、6 和 9）：

    multiple 属性规定输入域中可选择多个值。 

    
    
    
    
    
      
    
        模式（pattern） 是正则表达式。您可以在我们的 中学习到有关正则表达式的内容。
      
    
      
    
        下面的例子显示了一个只能包含三个字母的文本域（不含数字及特殊字符）：
      
    
      
    
    
    
    
    
      
    
        placeholder 属性提供一种提示（hint），描述输入域所期待的值。
      
    
      
    
        提示（hint）会在输入域为空时显示出现，会在输入域获得焦点时消失：
      
    
    
    
    
    
      
    
        required 属性规定必须在提交之前填写输入域（不能为空）。
      
    
    
    
    
    
      
    
        
      
    
      
    
        
      
    
    
    
  
    

    
                            
    
                                                
    
                    
    
                
    
            
    
            
    

            
    
                
    我要回帖
    
                
    
                    
    
                        
                        
                    
    
                
    
            
    
            
    
                        
    
                
    更多关于 html 的文章
    
                
    
                    
                
    
            
    
                    
    
        
    
            
    
                
     
    
                
    

                
    
            
    
            
    
            
    
                
    随机推荐