H5

您所在的位置：网站首页 › 气动截止阀接线方法图解大全集视频 › H5

H5

2024-07-06 15:38| 来源: 网络整理| 查看: 265

HTML5简介 ‘ HTML5=HTML+CSS+JS＋APIS 'HTML5新功能新增标签 input新类型及新属性硬件调用

一、HTML5简介万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改目标:HTML5取代HTML4和XHTML成为新标准

1、Html5 时间表2004年--提出构想2008年--发布第一份草案2012年--推广阶段2014年10月29日，万维网联盟泪流满面地宣布，经过几乎8年的艰辛努力，HTML5标准规范终于最终制定完成了，并已公开发布。

2、Html5 新特性新增标签：语义化更好多媒体功能：video\audio表单功能增强新的属性本地存储、离线存储获取拖拽内容信息地理位置信息canvas画布 ......

3、浏览器支持情况新版本的 Safari、Chrome、Firefox 、Opera以及IE10+ 支持大部分HTML5的新特性。IE9 支持部分 HTML5 新特性，IE6 7 8基本都不支持HTML5新特征。

二、HTML5新功能

1、新增标签

新增的结构元素----语义化标签-----定义页眉---------定义导航------定义外部的内容-----定义章节、区段-------定义当前页面或文章的附属信息部分------定义页脚-----定义网页标题元素（h1-h6）的组合-------定义媒介内容的分组，以及它们的标题--定义 figure 元素的标题新标签带来的是网页布局的改变及提升对搜索引擎的友好

2、新增的其他元素

--------定义日期/时间(语义化标签)-------定义有记号的文本---定义任务的进度-----定义输入域的选项列表

新增标签*{margin:0;padding:0;list-style: none;}body{font-size: 40px;text-align: center;color:#333;}.wrap{width:1020px;margin:0 auto;overflow:hidden;color:#fff;background: #e3e3e3;font-family: '微软雅黑';margin-bottom: 10px;}.header{height:60px;line-height: 60px;background: #666;}.nv{height:40px;line-height: 40px;font-size: 28px;margin:10px 0;background: #666;}.article{overflow: hidden;}.section{width:700px;height:450px;float: left;background: #333;}.aside{width:300px;height:450px;float: left;background: #666;margin-left: 20px;}.footer{height:60px;line-height: 60px;background: #666;margin-top:10px;}.pic{border:1px solid #333;}.pic img{width:200px;height:200px;}progress{width:800px;height:40px;}input{width:600px;height:40px;}headernavsectionasidefooterheadernavsectionasidefooter我是h1标签我是h2标签我是h3标签标题

内容内容呢哦

标题

内容内容呢哦

2016年10月19日：今天有雾霾，注意戴口罩！下载北京上海广州深圳var pro=document.getElementById('progress');var btn=document.getElementById('btn');var x=0,timer=null;btn.onclick=function(){timer=setInterval(function(){x++;if(x>pro.max){clearInterval(timer);btn.innerHTML='已下载完成';}else{btn.innerHTML='已下载'+x+'%';}pro.value=x;},100)}

----定义外部交互内容或插件------定义声音内容------定义视频-----定义媒介源-----定义图形

新增的其他标签被弃用的标签：、、、、、、、、、、、、、、和。

3、input的新属性placeholder: 占位符，输入框提示信息required: 该input为必填项autofocus: 在页面加载时，域自动地获得焦点pattern: 正则验证如: pattern="[0-9]{7,12}"min/max: input能输入的最小/最大字节的长度step: 针对number和range类型，每次递增step的值list: 指定一个datalist，作为下拉提示单 list值为datalist标签的id

input新属性*{margin:0;padding:0;list-style: none;}input{font-size:30px;color:#333;}/*伪元素*/input::-webkit-input-placeholder{color:#ccc;}/*火狐*/input::-moz-placeholder{color:#ccc;}/*IE*/input::-ms-input-placeholder{color:#ccc;}4、input的新类型email: 提交表单时检测值是否是一个电子邮件格式url: 提交表单时检测值是否是一个url格式date: 年-月-日格式的控件time: 时:分格式的控件datetime: 年-月-日时:分格式的控件（UTC时间）datetime-local: 年-月-日时:分格式的控件（本地时间）month: 年-月格式的控件week: 年-周数格式的控件

number: 数字输入框range: 选择区域tel: 电话输入框search: 用于搜索color: 调用系统选色器浏览器兼容opera对新属性的支持性最好，ie10以下不支持，其他主流浏览器部分支持

placeholder*{margin:0;padding:0;list-style: none;}body{font-size:30px;}input{font-size:30px;color:#333;padding:5px;}/*伪元素*/input::-webkit-input-placeholder{color:#ccc;}.range{padding:0;}email:url:date:time:datetime:datetime-local:month:week:number:range:tel:search:color:您选择的颜色var col=document.getElementById('col');var txt=document.getElementById('txt');txt.innerHTML='您选择的颜色'+col.value;// input有输入值时触发事件col.oninput=function(){txt.innerHTML='您选择的颜色'+col.value;txt.style.color=col.value;}

5、调用本地硬件调用本地摄像头调用本地相册拨打电话报警请使劲戳发送短信发短信

硬件调用.file { position: relative; display: inline-block; background: #D0EEFF; border: 1px solid #99D3F5; border-radius: 4px; padding: 4px 12px; overflow: hidden; color: #1E88C7; text-decoration: none; text-indent: 0; line-height: 20px;}.file input { position: absolute; font-size: 20px; left: 0; top: 0; opacity: 0;}.file:hover { background: #AADFFD; border-color: #78C3F3; color: #004974; text-decoration: none;}报警请使劲戳发短信摄像头相册 0 0 H5_Node1_新标签&新属性& 硬件调用 2、HTML5新标签和新属性 HTML link标签新属性 HTML5新标签control属性 html5自定义新标签属性 html5新标签和css3的新属性 Iframe和a标签的downLoad新属性实现-调用浏览器的本地下载功能 img 标签的新属性Srcset应用 h5 新标签 ——LBS 属性 HTML5、CSS3新标签、属性概况 HTML5中的新国际化标签及属性 HTML5 新标签和属性（video） img 标签的新属性Srcset应用 JSP2.0标签库新特性 —— 动态属性关于html5标签新属性的应用 date——input新属性，日期标签 HTML5 新标签和属性（表单验证）新云CMS标签调用代码大全1 java BigDecimal加法/减法/乘法/除法保留两位小数进程之信号通信矩阵的快速转置关于嵌入式的入门 python数据持久存储：pickle模块的基本使用 H5_Node1_新标签&新属性& 硬件调用 FragmentTransaction与Fragment生命周期的关系 Android基础--Activity生命周期 CodeForces 681B Economy Game (暴力) ViewPager的setOnPageChangeListener方法详解 JSP基础语法进程奔三奶爸初学php心得记录（第一天） nginx安装 nginx: [emerg] getpwnam(“www”) failed 错误

【本文地址】

H5

H5

今日新闻

推荐新闻