13888380739

[HTML5介绍]HTML5与HTML4的区别

HTML5与HTML4的联系

2019-02-15 13:55 前端教程 SEO小编

  HTML5是用于取代1999年所制定的 HTML 4.01 和 XHTML 1.0 标准的 HTML 标准版本,现在仍处于发展阶段,但大部分浏览器已经支持某些 HTML5 技术。HTML 5有两大特点:首先,强化了 Web 网页的表现性能。其次,追加了本地数据库等 Web 应用的功能。广义论及HTML5时,实际指的是包括HTML、CSS和JavaScript在内的一套技术组合。它希望能够减少浏览器对于需要插件的丰富性网络应用服务(plug-in-based rich internet application,RIA),如Adobe Flash、Microsoft Silverlight,与Oracle JavaFX的需求,并且提供更多能有效增强网络应用的标准集。

HTML5与HTML4的区别

HTML5与HTML4的区别

  1. HTML5推出的理由

  解决Web上存在的问题:

  Web浏览器间的兼容性低:在一个浏览器中可以运行的HTML、Css、Javascript,在另一个浏览器中不能运行。

  原因:各浏览器规范不统一,没有被标准化。

  解决方案:使各浏览器的功能符合通用标准。

  文档结构不够明确:HTML4中元素不能把文档结构表示清楚。

  解决方案:增加与结构相关的元素。

  Web应用程序的功能受到限制:HTMLL4对Web应用程序的贡献很小,比如:不允许同时上传多个文件。

  解决方案:提供供Web应用程序使用的API。

  2. HTML5语法的改变

  内容类型不变

  HTML5的文件扩展符(html或.htm)与内容类型(text/html)保持不变。

  DOCTYPE声明变化

  HTML4中需要指明是HTML的哪个版本,HTML5不需要,只使用即可。

  指定字符编码变化

  HTML4:<meta http-equiv=‶content-type″ content=‶text/html; charset=UTF-8″>

  HTML5:<meta charset=‶UTF-8″>

  可以省略元素的标记

  HTML5中很多元素标记可以省略

  具有boolean值的属性调整

  不指定属性值、属性名设定为属性值、字符串设为空时表示属性值为true;

  不写该属性表示属性值为false。

  例如:

  表示checked值为true

  表示checked值为true

  表示checked值为true

  表示checked值为false

  可省略引号

  HTML5可省略指定属性值时的引号。

  3. 新增的元素和废除的元素

  新增元素

  新增的结构元素

  section:表示页面中内容块,比如章节、页眉、页脚或页面中的其他部分,可与

  到

  结合使用表示文档结构。

  article:表示页面中一块与上下文不相关的独立内容,比如博客中的一篇文章或报纸中的一篇文章。

  aside:表示article内容之外,与article内容相关的辅助信息。

  header:表示页面中的区域块,通常用它表示标题。

  hgroup:用于对整个页面或页面中标题进行整合。

  footer:表示页面中的区域块,通常表示区域快的脚部或底部,用于承载作者姓名、创作日期等与作者的元素。

  nav:表示页面中导航部分。

  figure:表示一段独立的流内容,一般表示主体流内容的一个独立单元。

  新增的其他元素

  video:定义电影片段、视频流等视频。

  audio:定义音乐或音频流。

  canvas:画布,本身没有行为,仅提供一块画布,但它的API展现给JavaScript及脚本,能够把想绘制的东西绘制在canvas上。

  embed mark progress meter time ruby rt rp wbr command details detalist

  datagrid keygen output source menu

  新增的input元素的类型

  email:表示必须输的email地址

  url:表示文本框输入的一个地址

  number:表示数字

  range:表示数字范围值

  DataPickers:表示日历的日期、时间

  废除的元素

  能使用css代替的元素

  basefont big center font s tt u等

  不再使用frame框架

  由于frame框架对网页可用性存在负面影响,HTML5中已不支持frame框架,只支持iframe框架或者用服务器方式创建的由多个页面组成的复合页面的形式,同时将frameset元素、frame元素、noframes元素废除。

  只有部分浏览器支持的元素

  其他被废除的元素

  4. 新增的属性和废除的属性

  新增的属性

  表单相关的属性

  链接相关的属性

  其他属性

  废除的属性

  5. 全局属性

  HTML5中新增全局属性的概念,全局属性指可以对任何元素都使用的属性。

  contentEditable属性

  允许用户编辑元素中内容,使用该属性的元素必须为可以获得鼠标焦点的元素,而且在点击鼠标后向用户提供一个插入符号,提示用户该元素允许进行编辑。

  是boolean值类型,可以设为true、false或继承状态。其中,true代表可编辑,false代表不可编辑,当未指定true或false时与父元素的继承状态相同。

  designMode属性

  用来指定整个页面是否可编辑,当页面可编辑时,页面中所有支持contentEditable属性的元素都变为可编辑状况。designMode属性只能在JavaScript脚本中被修改、编辑。属性值可取on(可编辑)或off(不可编辑)。

  hidden属性

  HTML5中所有元素都允许使用hidden属性,该属性类似于input元素中hidden元素,boolean值,可设为true(不可见)、false(可见)。当某元素的hidden属性值为true时,浏览器不渲染该元素,使该元素处于不可见状态,但浏览器创建该元素内容,即页面加载后允许使用JavaScript脚本将该属性值取消,使该元素可见。

  spellcheck属性

  针对input(type=text)与textarea这两个文本输入框提供的一个新属性,主要对用户输入内容进行拼写与语法检查。属性值为boolean值,可取true或false。

  tableindex属性

  当点击Tab键时,让窗口或页面中可获得焦点的链接元素或表单元素进行遍历,tableindex表示该元素第几个被访问到。

  若tableindex值为"-1"时表示无法获取该元素.

  Html5特性

  A. 语义特性(Class:Semantic)

  HTML5赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa的,微数据与微格式等方面的支持,构建对程序、对用户都更有价值的数据驱动的Web。

  B. 本地存储特性(Class: OFFLINE & STORAGE)

  基于HTML5开发的网页APP拥有更短的启动时间,更快的联网速度,这些全得益于HTML5 APP Cache,以及本地存储功能。Indexed DB(html5本地存储最重要的技术之一) 和API说明文档。

  C. 设备兼容特性 (Class: DEVICE ACCESS)

  从Geolocation 功能的API文档公开以来,HTML5为网页应用开发者们提供了更多功能上的优化选择,带来了更多体验功能的优势。HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连,例如视频影音可直接与microphones及摄像头相联

  D. 连接特性(Class: CONNECTIVITY)

  更有效的连接工作效率,使得基于页面的实时聊天,更快速的网页游戏体验,更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术,Server-Sent Event和WebSocket就是其中的两个特性,这两个特性能够帮助我们实现服务器将数据’推送’到客户端的功能。

  E. 网页多媒体特性(Class: MULTIMEDIA)

  支持网页端的Audio、Video等多媒体功能, 与网站自带的APPS,摄像头,影音功能相得益彰。

  F. 三维、图形及特效特性(Class: 3D, Graphics & Effects)

  基于SVG、Canvas、WebGL及CSS3的3D功能,用户会惊叹于在浏览器中,所呈现的惊人视觉效果。

  G. 性能与集成特性(Class: Performance & Integration)

  没有用户会永远等待你的Loading——HTML5会通过XMLHttpRequest2等技术,帮助您的Web应用和网站在多样化的环境中更快速的工作。

htm、html、shtml区别
下一篇:没有了

声明:本页内容由昌盛网络通过网络收集编辑所得,所有资料仅供用户参考;本站不拥有所有权,也不承认相关法律责任。如您认为本网页中有涉嫌抄写的内容,请及时与我们联系进行举报,并提供相关证据,工作人员会在5个工作日内联系您,一经查实,本站将立刻删除涉嫌侵权内容。如果您对HTML5介绍核心技术文章感兴趣,请点击查看seo教程网站建设的相关文章,本文链接地址:[HTML5介绍]HTML5与HTML4的区别:http://www.smesseo.cn/web-jc/15.html , 转载请保留本说明!

 

相关资讯 Releva ntnews
最新文章 Latest articles
[HTML5介绍]HTML5与HTML4的区别
  1. 我们的优势
  2. 我们的实力
  3. 我们的未来
服务热线

18583200156

昌盛网络科技有限公司是专业的seo网络优化推广服务公司,专做网站优化排名,定制高端网站建设,9年的seo优化经验。
让你网站有排名有咨询,专业的事交给专业的人来做,选择我们靠谱。

Copyright© 2013-2019 昆明昌盛网络 版权所有