好程序员web前端分享HTML5与HTML之间有什么区别?

好程序员web前端分享HTML5与HTML之间有什么区别?很多没有学过HTML5大前端的同学,对HTML5并不了解,经常会提出疑问:HTML5与传统HTML有什么区别?今天,就为大家讲一下两者比较明显几个区别。首先,HTML5已经远远超越了标记语言的范畴,它的设计目的是在移动设备上支持多媒体,和HTML比起来,深度和广度上都做了进一步提升。

  接着,我们来看一下两者的声明文件类型:

  HTML:1、<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01//EN"

  "http://www.w3.org/TR/html4/strict.dtd"&gt;

  2、<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN"

  3、"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;

  HTML5:<!DOCTYPEhtml>

  由上面可以看到,在文档声明上,HTML的声明代码很长很复杂,而HTML5的声明更为简单,方便记忆,所以HTML5要比HTML更有利于程序员的快速阅读和开发。

  此外,两者结构语义也有所不同。HTML没有结构语义化的标签,通常以<divid="header"></div>来命名,HTML5则增加了很多语义化的标签,比如:<header>、<nav>、<article>、<aside>、<footer>等,使代码结构清晰,更加具有可读性。

  HTML5新增了强大的绘图功能,通过绘画功能,加上JS可以实现动画以及图片。而HTML4.0却不行。在HTML5中,Canvas和SVG可以进行绘图,Canvas相当于一个画布,可以通过JavaScript来绘制2D图形,Canvas是逐像素进行渲染的。SVG是可伸缩矢量图形,用于定义网络的基于矢量的图形,SVG严格遵从XML语法,其图像文件可读并且易于修改和编辑,可以被搜索、索引、脚本化或者压缩。可以在任何分辨率下被高质量地打印。

  除了上述几点,强大的HTML5还新增了视频标签。这个功能是HTML4.0所不具备的,用HTML4.0插入视频需要很长一段代码,但是用HTML5就只需要video标签即可。

  发展到今天,HTML5的功能已经十分强大,放眼未来,HTML5的发展潜力不可限量。

原文地址:https://blog.51cto.com/14573321/2446422

时间: 2024-10-15 07:31:20

好程序员web前端分享HTML5与HTML之间有什么区别?的相关文章

好程序员web前端分享HTML5常见面试题集锦四

好程序员web前端分享HTML5常见面试题集锦四1.为什么要初始化CSS样式?答案:因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示差异.当然,初始化样式会对SEO有一定的影响,但鱼和熊掌不可兼得,但力求影响最小的情况下初始化.2.浮动元素引起的问题?答案:a. 父元素的高度无法被撑开,影响与父元素同级的元素b. 与浮动元素同级的非浮动元素会跟随其后c. 若非第一个元素浮动,则该元素之前的元素也需要浮动,否则会影响页面显示的结构3.l

好程序员web前端分享HTML基础篇

好程序员web前端分享HTML基础篇,最近遇到很多新手,都会问,如果要学web前端开发,需要学什么?难不难学啊?多久能入门之类的问题?那么今天好程序员就先来给大家分享一下web前端学习路线:HTML基础 学习目标 1.本专业介绍.HTML相关概念,HTML发展历史 2.WEB标准,W3C/WHATWG/ECMA相关概念 3.相关软件的应用以及站点的创建 4.HTML基本结构和HTML语法 5.HTML常用标记 一.本专业介绍.HTML相关概念,HTML发展历史 本专业介绍 移动前端/WEB前端

好程序员web前端分享CSS文件引用的最优方法

好程序员web前端分享CSS文件引用的最优方法,在html总引入css文件的方法: 1链接式: 2导入式: 区别: 使用链接式时,会在加载页面主体部分之前加载css文件,这样现实出来的页面一开始就是带有样式效果的,而使用导入式时,会在整个页面装载完成之后再装载css文件,对于有的浏览器来说,在一些情况下,如果页面文件的体积比较大,则会出现先现实无样式的页面,闪烁一下之后再出现设置样式的效果.从浏览者的感受来说,这是使用导入式的一个缺陷.** 链接式比导入式快. 当有多个文件链接到页面的时候会导致

好程序员web前端分享css常用属性缩写

好程序员web前端分享css常用属性缩写,使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #000000可以缩写为#000;#336699可以缩写为#369; 盒尺寸 通常有下面四种书写方法: property:value1; 表示所有边都是一个值value1; property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2 pr

好程序员web前端分享定位锚点透明

好程序员web前端分享定位锚点透明 学习目标 1.position 定位属性和属性值 2.定位元素的层级属性 3.包含块的概念和应用 4.锚点连接的语法和应用场景 5.透明属性的应用 6.扩展:Flash和marquee(滚动字幕) 一.position 定位属性和属性值 position 定位属性,检索对象的定位方式:语法:position:static /absolute/relative/fixed/inherit/sticky/unset(未设置是inherit和initial的结合)/

好程序员web前端分享MVVM框架Vue实现原理

好程序员web前端分享MVVM框架Vue实现原理,Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js和react.js更加简洁.更易于理解的API,使得我们能够快速地上手并使用Vue.js. ? 1.什么是MVVM呢? MVVM的简写是Model-View-ViewModel. 在过去的10年里面,我们已经把很多传统的服务端代码放到了浏览器中,这样就产生了成千上万行的javascript代码,它们连接了HTML 和CSS文

好程序员web前端分享如何构建单页Web应用

好程序员web前端分享如何构建单页Web应用,首先我们来看一看单页应用是什么?所谓单页应用,指的是在一个页面上集成多种功能,甚至整个系统就只有一个页面,所有的业务功能都是它的子模块,通过特定的方式挂接到主界面上.它是AJAX技术的进一步升华,把AJAX的无刷新机制发挥到极致,因此能造就与桌面程序媲美的流畅用户体验. 其实单页应用我们并不陌生,很多人写过ExtJS的项目,用它实现的系统,很天然的就已经是单页的了,也有人用jQuery或者其他框架实现过类似的东西.用各种JS框架,甚至不用框架,都是可

好程序员web前端分享Cookie知识

好程序员web前端分享Cookie知识,今天小编为大家带来了一篇新手必看干货,接下来让我们一起来看一看吧. 一.Cookie的出现 浏览器和服务器之间的通信少不了HTTP协议,但是因为HTTP协议是无状态的,所以服务器并不知道上一次浏览器做了什么样的操作,这样严重阻碍了交互式Web 应用程序的实现. 针对上述的问题,网景公司的程序员创造了Cookie. 二.Cookie的传输 服务器端在实现Cookie标准的过程中,需要对任意HTTP请求发送Set-Cookie HTTP头作为响应的一部分: 1

好程序员web前端分享html中meta标签及用法详解

好程序员web前端分享html中meta标签及用法详解,这篇文章给大家介绍了html中meta标签及用法详解,感兴趣的朋友一起看看,Html中meta标签一.meta标签 含义 <meta> 元素 可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词. <meta> 标签位于文档的头部,不包含任何内容. <meta> 标签的属性定义了与文档相关联的名称/值对.二.meta 中常用属性 charset? (字符集) 说明:规