htm5
htm5在html4.0、 xhtm1.0的基础上增加了音频、视频、拖拽等功能,不过,htmL5,还在完善中,不过大部分浏览器都已经支持了部分功能。
兼容性:
最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。
header标签定义文档的页眉。
nav 标签定义导航链接的部分。
footer 标签定义页脚。
它们和之前的DIV差不多,但是这样更加有利于搜索引擎搜索到。
article定义标签定义独立的内容
<article>
<a href="http://www.apple.com">Safari 5 released</a><br / 7 Jun 2010. Just after the announcement of the new iPhone 4 at WWDC, Apple announced the release of Safari 5 for Windows and Mac......
</article>
section标签定义文档中的节
<section>
<h1>PRC</h
<p>The People's Republic of China was born in 1949...</p>
</section>
datalist 定义下拉列表,必须加上input
<input type="text" list="cars" />
<datalist id="cars">
<option >1</option>
<option >2</option>
<option >3</option>
</datalist> progress 表示下载进度 <progress max="100" value="50"></progress> <time> 标签定义公历的时间 <p>我们在每天早上 <time>9:00</time> 开始营业。</p> audio定义音频
<audio src="someaudio.wav">
您的浏览器不支持 audio 标签。
</audio> 如果不支持,则显示里面的内容 video标签定义视频 <video src="movie.ogg" controls="controls">
您的浏览器不支持 video 标签。
</video> 如果不支持,则显示里面的内容 HTML5 的新的表单属性 autocomplete 属性规定 form 或 input 域应该拥有自动完成功能。 E-mail: <input type="email" name="email"/>
自动实现邮箱的验证 required 属性规定必须在提交之前填写输入域(不能为空)。 Name: <input type="text" name="usr_name" required="required" /> placeholder 属性提供一种提示,输入域所期待的值。获得焦点后,消失。
<input type="search" name="user_search" placeholder="Search W3School" /> autofocus 属性规定在页面加载时,域自动地获得焦点。(程序最先出现的,执行最先出现的。)
User name: <input type="text" name="user_name" autofocus="autofocus" /> novalidate 属性规定在提交表单时不应该验证 form 或 input 域。
<form action="demo_form.asp" method="get" novalidate="true">
E-mail: <input type="email" name="user_email" />
<input type="submit" />
</form> pattern属性规定用于验证 input 域的模式
表示只能输入A-z,只能是3位数。
Country code: <input type="text" name="country_code"
pattern="[A-z]{3}" title="Three letter country code" /> 在购物车,添加数量的时候,可以用到添加、减少数量
name:<input type="number" min="1" max="10"/>
htm5的更多相关文章
- htm5移动端开发 和 pc端开发
htm5移动端开发: 移动端开发需要注意的一些事情:http://www.duanliang920.com/learn/web/html5/321.html HTML5移动端手机网站开发流程:http ...
- htm5手机端实现拖动图片
htm5手机端实现拖动图片 <pre> <!doctype html><html><head> <title>Mobile Cookbook ...
- htm5实现视差动画
requestAnimationFrame.js window.requestAnimFrame = (function() { return window.requestAnimationFrame ...
- htm5 user-scalable 的意思
<meta name="viewport" content="width=device-width,user-scalable=yes,minimum-scale= ...
- HTM5新增结构化元素&非结构化元素&新增属性详解
(1)HTML5 新增的主体结构元素 (2)HTML5 新增的的非主体结构元素 (3)HTML5 表单新增元素与属性 (4)HTML5 改良的 input 元素的种类
- HTM5 之 Canvas save 、restore 恢复画布状态的理解
save是用来保存canvas状态,这句话很关键,意思是指后续对canvas的操作:平移.放缩.旋转.错切.裁剪等可以恢复. 我之前一直没能理解,认为对画布的画线等操作也可以恢复,其实不是这样子的,只 ...
- 基于ES6模块标准通过webpack打包HTM5项目
本篇主要演示通过webpack打包phaser项目,webpack安装方法在此处就不一一赘述了 经常用phaser来写html5游戏的朋友可能会发现,当游戏场景比较多时,如果都写在一个js文件中那么将 ...
- HTM5新手学习的一些日常总结,相互交流和相互学习。
第一天 一.HTML--网页的源码(超文本标签语言) HTML标签 标签式是HTML最基本单位和最重要的组成. 使<和>扩起来 标签都是闭合的(规范) HTML标签属性 是标签的一部分,用 ...
- htm5拖放和画布
拖放 拖放是一种常见的特性,即抓取对象以后拖到另一个位置. 在 HTML5 中,拖放是标准的一部分,任何元素都能够拖放. 首先,为了使元素可拖动,把 draggable 属性设置为 true ondr ...
随机推荐
- smarty的学习计划(1)
1.什么事smarty? 不知道,smarty是一个使用PHP写出来的模板引擎,它提供了逻辑外在内容的分离 2.smarty优点: a.速度:成熟的模板引擎技术 b.编译型:采用smarty编写的程序 ...
- JAVA中事物以及连接池
一.事物 什么是事物? 事务,一般是指要做的或所做的事情.在计算机术语中是指访问并可能更新数据库中各种数据项的一个程序执行单元.这些单元要么全都成功,要么全都不成功. 做一件事情,这个一件事情中有多个 ...
- Window7 下 WNMP 环境搭建
WNMP 指"Windows 下的 Nginx.MariaDB/MySQL 和 PHP 环境". 下载 Nginx:http://nginx.org/en/download.htm ...
- DropDownList如何绑定DataTable,如何绑定DataSet
dpDnUpMenu是我定义的DropDownList控件 如果直接使用下面的方式,则会出现如下错误 dpDnUpMenu.DataSource = menu_tbBll.GetPID() dpDnU ...
- 001---Hibernate简介( 开源O/R映射框架)
该系列教程是使用hibernate3,hibernate4和3有区别(集成spring,使用等),请注意 001---Hibernate简介(开源O/R映射框架) ORM(Object Relatio ...
- 对clear float 的理解
之前自己对于清除浮动的用法比较模糊 ,如果用到的话,一般都是采用简单粗暴的方式解决,就是直接用overflow:hidden,但是越用久就会发现其实有BUG,这个BUG正是overflow:hidde ...
- Java之JSON数据
特别注意:使用JSON前需要导包 操作步骤地址:http://blog.csdn.net/baidu_37107022/article/details/70876993 1.定义 JSON(JavaS ...
- HTML表格表单综合——用户注册表
今天学习了表格和表单知识,我综合了他们添加了一些拓展知识做了一个用户注册表,以下面代码来整理表格和表单知识: <!DOCTYPE html PUBLIC "-//W3C//DTD XH ...
- webApi签名验证
还是一如既往先上结构图如下: 上一讲说明了redis,也谢谢心态的建议.这里经过改进后的redis的地址 当然这里是加密了的,具体实现如下图: 这里提供的解密. 先把加密解密的帮助类放上来. usin ...
- 让Chrome看不了WWDC直播的HLS技术详解
Requirements: Live streaming uses Apple's HTTP Live Streaming (HLS) technology. HLS requires an iPho ...