HTML5简介及新特性

HTML5简单理解就是在HTML的基础上加了一些新标准，新标签，本地化存储，移动端适配优秀，动画特效实现简洁（不依赖JS，纯DIV+CSS3.0），可直接对文件操作（图片压缩，浏览）。

HTML5常用新特性：
1.新标签
　　HTML5的新标签大致可分为两类。第一类是布局标签，第二类是独立标签。
　　布局标签：如header，footer标签替换div标签实现网页的页眉页脚布局。

<header>页眉</header><footer>页脚<footer/>
<div class="header">页眉</div><div class="header">页脚</div>

　　新标签的使用使HTML页面更加规范，友好，可让搜索引擎或者个人快速识别页面布局。
　　传统HTML为了能让搜索引擎抓取页面标题，内容的时候一般采用如下格式。

<div class="description" id="description">描述/div><div class="content" id="content">内容</div>

　　独立标签：如canvas标签，有自己的一套语法更新标签的内容，后续有讲解。
2.新CSS属性（一般称为CSS3.0）
　　传统CSS是静态的无法通过简单样式实现网页内部元素的动画效果，CSS3.0的translate属性即可实现旋转移动，在配合伪类@即可实现丰富的动画效果。
3.文件操作
　　文件的底层均是二进制数据流，HTML页面上面的文件都是将系统文件转换成base64格式数据流显示出来的。传统的HTML是无法操作这些数据流的，HTML5则可直接对图片的数据流操作，并配合JS实现上传图片的浏览，压缩等操作。（之前都是通过flash实现）
　　例：下面这张图片就是纯base64字符串生成的，格式<img src="https://img-blog.csdnimg.cn/2022010706251166507.jpeg">

4.本地化存储
　　浏览器本地化存储都是通过cookie，但cookie存取的数据量有限。操作系统考虑到安全性不允许浏览器任意访问修改本地文件，否则随便写个JS脚步就可以盗取用户信息，进行攻击。所以个人不看好这个方向，就不详细介绍了，有兴趣的可自行脑补。
5.新编程接口
　　目前还不完善，也不多做介绍了，感兴趣可自行搜索websocket。

HTML5简介及新特性相关推荐

HTML的表格标签，列表标签，表单标签，HTML5有哪些新特性
HTML的表格标签,列表标签,表单标签,HTML5有哪些新特性欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可博客园主页:博客园主页-冰山一树Sankey CSDN主页: ...
HTML5有哪些新特性、移除了哪些元素？
前端面试题(4) 打卡 2021-4-28 HTML HTML5 有哪些新特性.移除了哪些元素? HTML5新增27个元素移除16个元素根据现有的标准规范,把 HTML5的元素按优先级定义为 ...
【Day05】Html5 有哪些新特性？如何处理 Html5 新标签的浏览器兼容问题？如何区分 Html 和 Html5？
Html5 有哪些新特性?如何处理 Html5 新标签的浏览器兼容问题?如何区分 Html 和 Html5? 一.Html5 新特性 1. 拖拽释放(Drag and drop)API 2. 语义化更 ...
前端：JS/27/HTML DOM简介和新特性，HTML DOM访问HTML元素的方法，元素对象的属性（标准属性），noscroll事件，实例：书讯快递
HTML DOM简介和新特性 1,HTML DOM简介核心DOM中,提供的属性和方法,已经可以操作网页了,为什么还要HTML DOM? 如果在核心DOM中,网页中节点层级很深时,访问这个节点时将十分 ...
HTML5有哪些新特性
HTML5有哪些新特性.移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5? HTML5 是定义 HTML 标准的最新的版本. 该术语表示两个不同的概念: 它 ...
开课吧：Html5有哪些新特性？
在编程中,语义指的是一段代码的含义,这个HTML元素有什么作用,扮演了什么样的角色.简单的概括为:在适当的位置使用适当的标签,用正确的标签做正确的事情 Html5有哪些新特性? Html5有哪些新特性 ...
前端教程：HTML5有哪些新特性？
当我们进行Web开发时,使用Html是非常重要的,因为它包含了最基本的网页结构,尽管Html只能帮助我们构建静态网页,但这是我们最不能缺少的部分,如果将网页比作房屋,那么Html就是基础,今天就跟随小 ...
HTML5超酷新特性WebSockets初体验
人人网Web前端开发工程师暴风彬彬(网名),在个人网站彬Go上发表了一篇博文<HTML5 WebSockets 基础使用教程>,和大家一起分享了如何利用HTML5超酷新特性WebSocke ...
前端HTML5十大新特性详细总结
前端HTML5十大新特性总结一必须知道写前端的都知道,在代码最前面都有这一行代码,大家都知道一定要把这东西写上去. <!DOCTYPE html> 但是!这是什么玩意儿?为什么要写上 ...

HTML5简介及新特性

HTML5简介及新特性相关推荐

最新文章

热门文章