HTML5,CSS3新特性,与旧版的区别
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新特性,与旧版的区别的更多相关文章
- 使用Modernizr探测HTML5/CSS3新特性(转载)
转载地址:http://www.cnblogs.com/TomXu/archive/2011/11/18/detecting-html5-css3-features-using-modernizr.h ...
- 使用Modernizr探测HTML5/CSS3新特性
[转] HTML5, CSS3以及相关技术(例如canvas和web sockets)带来了非常有用的特性,可以让我们的web程序提升一个新的level.这些新技术允许我们只用HTML,CSS和Jav ...
- 学习前端第一天心得体会(初步了解HTML5的新特性以及和HTML的区别)
一.HTML5是什么? HTML5 是最新的 HTML 标准. HTML5 是专门为承载丰富的 web 内容而设计的,并且无需额外插件. HTML5 拥有新的语义.图形以及多媒体元素. HTML5 提 ...
- html5 css3新特性了解一下
html5: 用于绘画的 canvas 元素 以及SVG 用于媒介回放的 video 和 audio 元素 拖拽(Drag 和 drop) 地理定位(Geolocation) 对本地离线存储的更好的支 ...
- html5.css3新特性
块: article section, Nav aside header footer 内容分组 future fig caption main 文本级别标签 time i b em str ...
- 21、前端知识点--html5和css3新特性汇总
跳转到该链接 新特性汇总版: https://www.cnblogs.com/donve/p/10697745.html HTML5和CSS3的新特性(浓缩好记版) https://blog.csdn ...
- HTML5和CSS3新特性
1.HTML5新标签和属性 1.1 兼容性前缀与语义化 兼容低版本的写法.比较新的浏览器,可以直接写.兼容性前缀,是每个浏览器私有的. 内核 兼容性前缀 浏览器 Gecko -moz- Firefox ...
- 浅谈HTML5的新特性
2014年10月29日,W3C宣布,经过接近8年的艰苦努力,HTML5标准规范终于制定完成. HTML5将会取代1999年制定的HTML 4.01.XHTML 1.0标准,使网络标准达到符合当代的网络 ...
- CSS3新特性(阴影、动画、渐变、变形、伪元素等)
CSS3与页面布局学习总结(六)--CSS3新特性(阴影.动画.渐变.变形.伪元素等) 目录 一.阴影 1.1.文字阴影 1.2.盒子阴影 二.背景 2.1.背景图像尺寸 2.2.背景图像显示的原 ...
- H5 和 CSS3 新特性
博客地址:https://ainyi.com/52 H5 新特性 语义化标签:header.footer.section.nav.aside.article 增强型表单:input 的多个 type ...
随机推荐
- 关闭 sftp
vi /etc/ssh/sshd_config 注释掉这行Subsystem sftp /usr/libexec/openssh/sftp-server /etc/rc.d/init.d/ss ...
- jquery时间格式化插件
插件的代码: (function($){ $.formatDate = function(pattern,date){ //假设不设置,默觉得当前时间 if(!date) date = new Dat ...
- Asp.net动态页面静态化之初始NVelocity模板引擎
Asp.net动态页面静态化之初始NVelocity模板引擎 静态页面是网页的代码都在页面中,不须要运行asp,php,jsp,.net等程序生成client网页代码的网页,静态页面网址中一般不含&q ...
- 【iOS开发-30】UITabBarController的几种代理方法以及结合NSUserDefaults还原上次退出时被选中视图控制器和视图控制器的顺序
一.UITabBarController的几种代理方法 在AppDelegate.h中加入一个协议<UITabBarControllerDelegate>.然后再AppDelegate.m ...
- 剪切具有CornerRadius的RectangleGeometry(可能在Ripple中用到)
剪切具有CornerRadius的RectangleGeometry(可能在Ripple中用到) 1.新建Converter public class BorderClipConverter : IM ...
- bzoj4823: [Cqoi2017]老C的方块(最小割)
4823: [Cqoi2017]老C的方块 题目:传送门 题解: 毒瘤题ORZ.... 太菜了看出来是最小割啥边都不会建...狂%大佬强强强 黑白染色?不!是四个色一起染,四层图跑最小割... 很 ...
- nyoj--914--Yougth的最大化(二分查找)
Yougth的最大化 时间限制:1000 ms | 内存限制:65535 KB 难度:4 描述 Yougth现在有n个物品的重量和价值分别是Wi和Vi,你能帮他从中选出k个物品使得单位重量的价值最 ...
- linux 下的文件搜索、可执行文件搜索
1. whereis 与 which 速度快,只是模糊查询,例如查询 $ whereis mysql,则会将mysql, mysql.ini, mysql*所在的目录都找出来: whereis 查看的 ...
- RAC IP 地址修改
RAC 修改IP: 版本信息: REDHAT AS5 ORACLE 11G R2, 两个节点. 修改如下: 1.修改/etc/host(rac1,rac2) 192.168.3.205 rac-s ...
- (转载) Android RecyclerView 使用完全解析 体验艺术般的控件
Android RecyclerView 使用完全解析 体验艺术般的控件 标签: Recyclerviewpager瀑布流 2015-04-16 09:07 721474人阅读 评论(458) 收藏 ...