HTML5新特性

(1)语意化更好的内容元素,比如 article、footer、header、nav、section
(2)本地存储。sessionStorage、localStorage和indexedDB加强本地存储。使用之前应该先判断支持情况
if(window.sessionStorage){
//浏览器支持sessionStorage
}
if(window.localStorage){
//浏览器支持localStorage
}

localStorage和sessionStorage,cookie的区别:
sessionStorage基于会话,关闭浏览器之后存储消失。
localStorage是域内安全,也就是同一个域才能对localStorage进行存储,所以可能遇到的坑是跨域问题,可以通过postMessage来解决
localStorage在各浏览器中上限不同,最低的是2.6MB, 所以开发上限为2.6MB,如果还是不够的话可借助indexedDB, indexedDB上限是250MB。
localStorage和cookie另一个区别是没有过期时间,不过这个可以在localStorage中加一个时间字段轻松解决这个问题。

(3)离线web应用

(4)表单新增功能

可以通过input的form属性綁定form,实现数据随着form表单一起提交
placeholder屬性
autofocus属性,页面只能有一个
表单控件,calendar、date、time、email、url、search、number。

(5)地理定位

CSS3提供了更多的选择器:

before、after、first-child、nth-child。提供的效果包括box-shadow、text-shadow、background-size选择器,盒模型,背景和边框,文字特效,2D/3D转换,动画,多列布局,用户界面

-moz、-webket,-o,-ms(IE)等等css做浏览器兼容用
还可以使用media-query实现响应式布局
用于媒介回放的 video 和 audio 元素
用于绘画 canvas 元素

HTML5,CSS3新特性,与旧版的区别的更多相关文章

  1. 使用Modernizr探测HTML5/CSS3新特性(转载)

    转载地址:http://www.cnblogs.com/TomXu/archive/2011/11/18/detecting-html5-css3-features-using-modernizr.h ...

  2. 使用Modernizr探测HTML5/CSS3新特性

    [转] HTML5, CSS3以及相关技术(例如canvas和web sockets)带来了非常有用的特性,可以让我们的web程序提升一个新的level.这些新技术允许我们只用HTML,CSS和Jav ...

  3. 学习前端第一天心得体会(初步了解HTML5的新特性以及和HTML的区别)

    一.HTML5是什么? HTML5 是最新的 HTML 标准. HTML5 是专门为承载丰富的 web 内容而设计的,并且无需额外插件. HTML5 拥有新的语义.图形以及多媒体元素. HTML5 提 ...

  4. html5 css3新特性了解一下

    html5: 用于绘画的 canvas 元素 以及SVG 用于媒介回放的 video 和 audio 元素 拖拽(Drag 和 drop) 地理定位(Geolocation) 对本地离线存储的更好的支 ...

  5. html5.css3新特性

    块: article section, Nav aside header footer  内容分组 future fig caption main 文本级别标签   time i b  em  str ...

  6. 21、前端知识点--html5和css3新特性汇总

    跳转到该链接 新特性汇总版: https://www.cnblogs.com/donve/p/10697745.html HTML5和CSS3的新特性(浓缩好记版) https://blog.csdn ...

  7. HTML5和CSS3新特性

    1.HTML5新标签和属性 1.1 兼容性前缀与语义化 兼容低版本的写法.比较新的浏览器,可以直接写.兼容性前缀,是每个浏览器私有的. 内核 兼容性前缀 浏览器 Gecko -moz- Firefox ...

  8. 浅谈HTML5的新特性

    2014年10月29日,W3C宣布,经过接近8年的艰苦努力,HTML5标准规范终于制定完成. HTML5将会取代1999年制定的HTML 4.01.XHTML 1.0标准,使网络标准达到符合当代的网络 ...

  9. CSS3新特性(阴影、动画、渐变、变形、伪元素等)

    CSS3与页面布局学习总结(六)--CSS3新特性(阴影.动画.渐变.变形.伪元素等)   目录 一.阴影 1.1.文字阴影 1.2.盒子阴影 二.背景 2.1.背景图像尺寸 2.2.背景图像显示的原 ...

  10. H5 和 CSS3 新特性

    博客地址:https://ainyi.com/52 H5 新特性 语义化标签:header.footer.section.nav.aside.article 增强型表单:input 的多个 type ...

随机推荐

  1. java之IO处理

    File文件基础 文件与文件夹抽象路径名称的表示.其构造方法有四个 File(File parent,String child):从抽象父文件夹下创建一个File实例. File(String par ...

  2. python设计模式 之 简单工厂模式

    简单工厂模式属于类的创建型模式,适合用来对大量具有共同接口的类进行实例化,它能够推迟到执行的时候才动态决定要创建哪个类的实例.而不是在编译时就必须知道要实例化哪个类. python: #!/usr/b ...

  3. [Struts2] No result defined for action ... and result input & Invalid field value for field ...

    "No result defined for action ... and result input"错误一般发生在Struts2的拦截器拦截时遇到了问题时.Struts2会将跳转 ...

  4. RT-Thread开篇

    一直以来对操作系统都有一种既仰慕又畏惧的情感.一方面被操作系统的强大深深吸引.还有一方面又被操作系统的复杂性感到畏惧. 记得在学校的时候也学过一些操作系统的理论知识,但也只限于理论,更似人云亦云. 本 ...

  5. (OpenGL ES 2.0 Shading Language) attribute 、uniform 和 varying

    一:attribute .uniform 和 varying 都是glsl的变量的内存指示器(storage qualifiers),指明变量的内存特性 二:attribute attribute 是 ...

  6. gist.github.com

    hosts添加:192.30.253.118 gist.github.com

  7. Z 字形变换 C++实现 java实现 leetcode系列(六)

    Z 字形变换  java实现 C++实现  将一个给定字符串根据给定的行数,以从上往下.从左到右进行 Z 字形排列. 比如输入字符串为 "LEETCODEISHIRING" 行数为 ...

  8. Opencv 编译

    转载 https://www.cnblogs.com/xinxue/p/5766756.html OpenCV 3.4 版本,圣诞节前发布了,该版本新增了一种去掉视频背景的算法,dnn 模块的进一步改 ...

  9. Android UnitTest FrameWork

    Android test suites基于Junit,可以直接使用Junit测试不使用android api的class,也可以使用android的Junit extensions测试android ...

  10. STM8S103 解决Rom空间不足 & Map文件分析

    STM8S103只有8KRom,很容易造成空间不足.对于空间不足,我们就要从map文件着手分析,究竟哪些函数占了多少空间,map文件分为几部分:Segments(总括了各个段所占的空间), Modul ...