HTML5和HTML4的主要区别 [转]
原文:http://www.cnblogs.com/jiangyehu1110/archive/2013/07/10/3182277.html
1. HTML5标准还在制定中
这头一个不同之处显而易见,但非常重要,我需要先从它开始。也许你已经注意到了关于HTML5很酷的言论到处都是,但是事实情况是,HTML5是一个还未完成的标准。HTML4已经有10岁了,但它仍是当前正式的标准的事实没有改变。
另一方面,HTML5仍处在早期阶段,以后的修改会不断的出现。你必须考虑到这些,因为你在网站上使用的这些新增加或修改的网页元素会每年都出现一些变化,你需要不停的更新升级你的网站,这可不是你希望的。这就是目前为止,你最好在产品里使用HTML4,只在实验里使用HTML5的原因。
2. 简化的语法
更简单的doctype声明是HTML5里众多新特征之一。现在你只需要写<!doctype html>,这就行了。HTML5的语法兼容HTML4和XHTML1,但不兼容SGML。
3. 一个替代Flash的新 <canvas> 标记
对于Web用户来说,Flash既是一个惊喜,也是一种痛苦。有很多的Web开发人员对HTML5对Flash产生的威胁很不满。但对于那些忍受着要花几年时间加载和运行的臃肿的Flash视频的人来说,用新的 <canvas> 标记生成视频的技术已经到来。
目前, <canvas> 标记并不能提供所有的Flash具有的功能,但假以时日,Flash必将从web上淘汰。我们拭目以待,因为很多人还并不认同这种观点。
4. 新的 <header> 和 <footer> 标记
HTML5的设计是要更好的描绘网站的解剖结构。这就是为什么这些<header> 和<footer> 等新标记的出现,它们是专门为标志网站的这些部分设计的。
在开发网站时,你不在需要用<div>标记来标注网页的这些部分。
5. 新的 <section> 和 <article> 标记
跟<header> 和 <footer>标记类似,HTML5中引入的新的<section> 和 <article> 标记可以让开发人员更好的标注页面上的这些区域。
据推测,除了让代码更有组织外,它也能改善SEO效果,能让搜索引擎更容易的分析你的页面。
6. 新的 <menu> 和 <figure> 标记
新的<menu>标记可以被用作普通的菜单,也可以用在工具条和右键菜单上,虽然这些东西在页面上并不常用。
类似的,新的 <figure> 标记是一种更专业的管理页面上文字和图像的方式。当然,你可以用样式表来控制文字和图像,但使用HTML5内置的这个标记更适合。
7. 新的 <audio> 和 <video> 标记
新的<audio> 和 <video> 标记可能是HTML5中增加的最有用处的两个东西了。正如标记名称,它们是用来嵌入音频和视频文件的。
除此之外还有一些新的多媒体的标记和属性,例如<track>,它是用来提供跟踪视频的文字信息的。有了这些标记,HTML5使Web2.0特征变得越来越友好。问题在于,在HTML5还未被广泛的接受之前,Web2.0还是老的Web2.0。
8. 全新的表单设计
新的 <form> 和 <forminput> 标记对原有的表单元素进行的全新的修改,它们有很多的新属性(以及一些修改)。如果你经常的开发表单,你应该花时间更详细的研究一下。
9. 不再使用 <b> 和 <font> 标记
官方的指导说这些标记可以通过CCS来做更好的处理,但这样一来,为了在文章一两个地方出现的这种标记,你就需要在独立的css和文本两个地方来实现这一的功能,岂不笨拙。也许我们以后会习惯这种方法。
10. 不再使用 <frame>, <center>, <big> 标记
事实上,我已经记不清曾经何时用过这些标记了,所以,我并不为去除这些标记感到悲哀。相同的原因,有更好的标记能实现它们的功能——这很好,任何作废的标记从标准中剔除都是受欢迎的。
这10个HTML5和HTML4之间的不同只是整个新的规范中的一小部分。除了这些主要的变动外,我还可以略提一下一些次要的改动,比如修改了<ol> 标记的属性,让它能够倒排序,对<u>标记也做了修改。
所有这些次要的改动数量众多。而且新的修改也在不断的增加,因此,如果你想实时跟踪最新的动向,你需要经常的查看w3.org的HTML4 和 HTML5之间的不同这个页面。如果你很心急,想在你的工作中使用这些新的标记和属性,我劝告你最好只是做实验,原因已经说的很清楚了,这些新标记和新属性在将来也许会有很大的改变,所以,除非你不断的更新你的代码,它们很可能会过期失效。
尽管如今大多数流行的浏览器的最新版都支持HTML5,但有些新的(或修改的)标记和属性它们并不支持,所以你的网页在用户的屏幕上有可能前后显示的不一致。
HTML5和HTML4的主要区别 [转]的更多相关文章
- 小强的HTML5移动开发之路(3)——HTML5与HTML4比较
来自:http://blog.csdn.net/dawanganban/article/details/17652873 在前面介绍了HTML5的新特性,新标签的使用,智能表单设计,引入多媒体对象,C ...
- HTML-HTML5+CSS3权威指南阅读(一、HTML5与HTML4之间的区别)
一.HTML5与HTML4之间的区别 1. DOCTYPE 声明 1). HTML4 中为 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 T ...
- HTML5与HTML4的比较
HHTML5封装一些标签和属性,方便了开发. <form> <p> <label>Username:<input name="search" ...
- 面试中的一些小问题之html5和html4的区别?
HTML5建立的一些新规则: 新特性应该基于HTML.CSS.DOM.JavaScript: 减少对外部插件的需求,如flash将会用video标签和audio标签代替: 更加优秀的错误处理: 更多取 ...
- HTML5系列:HTML5与HTML4的区别
1. 语法的改变 1.1 DOCTYPE声明 DOCTYPE声明在HTML文件中必不可少,位于文件第一行. HTML4中声明方法: <!DOCTYPE html PUBLIC "-// ...
- html5与html4的区别,如何一眼区分
还是在面试过程中遇到的这个问题,但是当时感觉回答的不是很全面,回来以后自己做的总结: 以上这个问题如果教大家看源码,可能一眼很直观的就能认出,那个是html4,那个是html5,但是面试的时候问道这个 ...
- Html5 与 Html4 的区别
HTML5是HTML标准的下一个版本.虽然HTML5没有完全颠覆HTML4,但是它们也有一些不同.最新最全的HTML5-HTML4对比信息 请看http://dev.w3.org/html5/html ...
- WEB前端之HTML5~HTML5与HTML4的区别
推出的理由及目标 WEB浏览器存在的问题包括以下三点 世界知名浏览器厂商对HTML5的支持 语法的改变 DOCTYPE的声明 XHTML的DOCTYPE声明方式 HTML4的DOCTYPE声明方式 H ...
- HTML5与HTML4的区别-----文档结构
HTML5在结构和语法上做了大量的简化.当然,也提供了语义化的标签 结构上区别: 1.简化了文档声明语句 HTML5仅规定了一种: <!DOCTYPE html> 2. ...
随机推荐
- Maven项目中的pom.xml详解【转】
什么是pom? pom作为项目对象模型.通过xml表示maven项目,使用pom.xml来实现.主要描述了项目:包括配置文件:开发者需要遵循的规则,缺陷管理系统,组织和licenses,项目的url, ...
- 测试工作的疑难杂症bugs
一. 平台:安卓app 代码:重写onresume事件时,没有重新获取sessionId导致记录一下bug重现过程:1.登陆2.退出用户(不退出app)3.重新登录4.home键或者息屏5.再进入ap ...
- 【jQuery示例】遍历表单数据并显示
<!DOCTYPE html> <html> <head> <style> body, select { font-size:14px; } form ...
- 更新/替换系统 hosts,轻松访问国外站点
更新 hosts 下面介绍的操作均可能覆盖现有 hosts ,进行操作前请先确认是否需要备份. 推荐使用本项目的 Host Tools 来自动化 备份/配置 工作. 若更新 hosts 未立即生效,请 ...
- Zabbix监控php-fpm status
开启php-fpm status php-fpm.conf pm.status_path = /statusx45 nginx.conf location ~ /(statusx45)$ { incl ...
- NSOprationQueue 与 GCD 的区别与选用
原文链接:http://www.jianshu.com/p/d09e2638eb27 GCD 技术是一个轻量的,底层实现隐藏的神奇技术,我们能够通过GCD和block轻松实现多线程编程,有时候,GCD ...
- css基于绝对定位的垂直水平居中技术
翻译:http://blog.csdn.net/freshlover/article/details/11579669 原文:http://coding.smashingmagazine.com/20 ...
- Install Docker on Ubuntu
Install Docker on Ubuntu Estimated reading time: 17 minutes Docker is supported on these Ubuntu oper ...
- jQuery animate动画 stop()方法详解~
一.动画格式: 格式一:jQueryObject.animate( cssProperties, options ) 格式二:$('#id').animate( styles[, duration ] ...
- 使用 Eclipse 调试 Java 程序的 10 个技巧
你应该看过一些如<关于调试的N件事>这类很流行的帖子 .假设我每天花费1小时在调试我的应用程序上的话,那累积起来的话也是很大量的时间.由于这个原因,用这些时间来重视并了解所有使我们调试更方 ...