html5 css3新特性了解一下
html5:
- 用于绘画的 canvas 元素 以及SVG
- 用于媒介回放的 video 和 audio 元素
- 拖拽(Drag 和 drop) 地理定位(Geolocation)
- 对本地离线存储的更好的支持
localStorage - 没有时间限制的数据存储
sessionStorage - 针对一个 session 的数据存储
之前,这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。
在 HTML5 中,数据不是由每个服务器请求传递的,而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。
对于不同的网站,数据存储于不同的区域,并且一个网站只能访问其自身的数据。) - 新的特殊内容元素,比如 article、footer、header、nav、section
- 新的表单控件,比如 calendar、date、time、email、url、search
- 新的 form 属性:
autocomplete
novalidate - 新的 input 属性:
autocomplete
autofocus
form
form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget)
height 和 width
list
min, max 和 step
multiple
pattern (regexp)
placeholder
required - 语义元素:有利于搜索引擎优化和快速查找
HTML5 添加了很多语义元素如下所示:
标签 描述
<article> 定义页面独立的内容区域。
<aside> 定义页面的侧边栏内容。
<bdi> 允许您设置一段文本,使其脱离其父元素的文本方向设置。
<command> 定义命令按钮,比如单选按钮、复选框或按钮
<details> 用于描述文档或文档某个部分的细节
<dialog> 定义对话框,比如提示框
<summary> 标签包含 details 元素的标题
<figure> 规定独立的流内容(图像、图表、照片、代码等等)
<figcaption> 定义 <figure> 元素的标题
<footer> 定义 section 或 document 的页脚。
<header> 定义了文档的头部区域
<mark> 定义带有记号的文本。
<meter> 定义度量衡。仅用于已知最大和最小值的度量。
<nav> 定义导航链接的部分。
<progress> 定义任何类型的任务的进度。
<ruby> 定义 ruby 注释(中文注音或字符)。
<rt> 定义字符(中文注音或字符)的解释或发音。
<rp> 在 ruby 注释中使用,定义不支持 ruby 元素的浏览器所显示的内容。
<section> 定义文档中的节(section、区段)。
<time> 定义日期或时间。
<wbr> 规定在文本中的何处适合添加换行符。
css3:
CSS3实现圆角(border-radius),阴影(box-shadow),
对文字加特效(text-shadow、),线性渐变(gradient),旋转(transform)
transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);// 旋转,缩放,定位,倾斜
增加了更多的CSS选择器 多背景 rgba
在CSS3中唯一引入的伪元素是 ::selection.
媒体查询,多栏布局
border-image
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.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 ...
- H5 和 CSS3 新特性
博客地址:https://ainyi.com/52 H5 新特性 语义化标签:header.footer.section.nav.aside.article 增强型表单:input 的多个 type ...
- 浅谈HTML5的新特性
2014年10月29日,W3C宣布,经过接近8年的艰苦努力,HTML5标准规范终于制定完成. HTML5将会取代1999年制定的HTML 4.01.XHTML 1.0标准,使网络标准达到符合当代的网络 ...
- 新特性AAtitti css3 新特性attilax总结titti css
Atitti css3 新特性attilax总结 图片发光效果2 透明渐变效果2 文字描边2 背景拉伸2 CSS3 选择器(Selector)4 @Font-face 特性7 Word-wrap &a ...
- Atitti css3 新特性attilax总结
Atitti css3 新特性attilax总结 图片发光效果2 透明渐变效果2 文字描边2 背景拉伸2 CSS3 选择器(Selector)4 @Font-face 特性7 Word-wrap &a ...
随机推荐
- java设计模式之桥梁模式(Bridge)
1.桥梁模式 与 策略模式 非常相似 (其实很多设计模式都相似,因为所有的模式都是按照设计原则 而设计出来的,设计原则就相当于武功的心法,设计模式就是招式,只要心法过硬,就可以无招胜有招了.) 这里也 ...
- MySQL wait_timeout参数设置与网上常见错误小纠
discard connection com.mysql.jdbc.exceptions.jdbc4.CommunicationsException: Communications link fail ...
- 清除SQL Server内存
数据库进行查询时,会缓存结果集,当查询结果过大时会出现内存爆满的情况,如果手动清除SQL所占用的内存呢,在网上搜索一下,把结果贴下面: --强制释放内存 Create procedure [dbo]. ...
- Shiro - web应用
先不谈Spring,首先试着用最简易的方式将Shiro集成到web应用. 即使用一些Servlet ContextListener.Filter.ini这些简单的配置完成与web应用的集成. web. ...
- requset获取post提交的请求参数
1.请求体的内容通常是通过post来提交的,格式是 username=zhansan&password=123&hobby=football||&hobby=basketbal ...
- Tomcat源码(二):tomcat启动之前的初始化
当tomcat启动的时候 首先会加载 org.apache.ctalina.startup.BootStrap类. 使用eclipse或idea启动tomcat其实就是在启动这个类的main方法 根据 ...
- shell变量类型和运算符
一.shell变量的应用 1.shell变量的种类 ①用户自定义变量:由用户自己定义,修改和使用 ②预定义变量:bash预定义的特殊变量,不能直接修改 ③位置变量:通过命令行给程序传递执行参数 二.变 ...
- https、公钥、私钥白话解说
原文 摘要:本文尝试一步步还原HTTPS的设计过程,以理解为什么HTTPS最终会是这副模样.但是这并不代表HTTPS的真实设计过程.在阅读本文时,你可以尝试放下已有的对HTTPS的理解,这样更利于“还 ...
- PHP三维优先级运算
昨天去某大型公司面试,做了一套面试题,整套面试题的基础要求比较高,对于js的使用有一定的要求.在本次面试中碰到PHP三维运算优先级的问题,先看题: <?php $b=20; $c=40; $a= ...
- phpmyadmin数据表结构没有显示注释列
新开的一个项目,用phpmyadmin作为图形化操作数据库工具.创建数据表时为其每列添加好注释,浏览数据表内容有显示注释内容,但是查看数据表结构没有显示注释列,不方便直观查看数据表每列的意思. 上网搜 ...