dede游戏网站模板,国内crm系统十大排名,网络游戏陪玩,百度热搜广告位一.HTML5 简介
1.什么是HTML5
HTML5是新一代的 HTML 标准#xff0c;2014年10月由万维网联盟( W3C#xff09;完成标准制定。官网地址: w3c提供:HTML StandardWHATWG提供: HTML Standard
HTML5在狭义上是指新—代的 HTML 标准#xff0c;在广义上是指:整个前端。
2.HTML…一.HTML5 简介
1.什么是HTML5
HTML5是新一代的 HTML 标准2014年10月由万维网联盟( W3C完成标准制定。官网地址: w3c提供:HTML StandardWHATWG提供: HTML Standard
HTML5在狭义上是指新—代的 HTML 标准在广义上是指:整个前端。
2.HTML5的优势
针对JavaScript新增了很多可操作的接口。新增了一些语义化标签、全局属性。新增了多媒体标签可以很好的替代flash。更加侧重语义化对于SEO更友好。可移植性好可以大量应用在移动设备上。
二.HTML5新增语义化标签
1.布局标签
header整个页面或部分区域的头部footer整个页面或部分区域的底部nav导航article文章、帖子、杂志、新闻、博客、评论等。 artical里面可以有多个section 。section强调的是分段或分块如果你想将一块内容分成几段的时候可使用section元素。article 比 section更强调独立性一块内容如果比较独立、比较完整应该使用article元素。
section页面中的某段文字或文章中的某段文字(里面文字通常里面会包含标题)。aside侧边栏
2.状态标签
meter标签定义已知范围内的标量测量。也被称为 gauge(尺度)双标签例如:电量、磁盘用量等。 high属性规定高值low属性规定低值max属性规定最大值min属性规定最小值optimum属性规定最优值value属性规定当前值
progress标签显示某个任务完成的进度的指示器一般用于表示进度条双标签例如:工作完成进度等。 max属性规定目标值value属性规定当前值
3.列表标签
datalist用于搜索框的关键字提示
input typetext listmydata
datalist idmydataoption value周冬雨周冬雨/optionoption value周杰伦周杰伦/optionoption value温兆伦温兆伦/optionoption value马冬梅马冬梅/option
/ datalist
details用于展示问题和答案或对专有名词进行解释summary写在details 的里面用于指定问题或专有名词
detailssummary如何走上人生巅峰?/ summaryp—步一步走呗/p
/details
4.文本标签
ruby标签文本注音 tr标签注音标签写在ruby里面
mark标签标记
5.表单控件属性
paceholder提示文字(注意:不是默认值 value是默认值)适用于文字输入类的表单控件。required表示该输入项必填适用于除按钮外其他表单控件。autofocus自动获取焦点适用于所有表单控件。autocomplete自动完成可以设置为on或off适用于文字输入类的表单控件。注意:密码输入框、多行输入框不可用。pattern填写正则表达式适用于文本输入类表单控件。注意:多行输入不可用且空的输入框不会验证往往与required配合。novalidateform标签新增属性如果给form标签设置了该属性表单提交的时候不再进行验证。
6.type新增属性值
email邮箱类型的输入框表单提交时会验证格式输入为空则不验证格式。urlurl类型的输入框表单提交时会验证格式输入为空则不验证格式。number数字类型的输入框表单提交时会验证格式输入为空则不验证格式。search搜索类型的输入框表单提交时不会验证格式。tel电话类型的输入框表单提交时不会验证格式在移动端使用时会唤起数字键盘。range范围选择框默认值为50表单提交时不会验证格式。color颜色选择框默认值为黑色表单提交时不会验证格式。date日期选择框默认值为空表单提交时不会验证格式。month月份选择框默认值为空表单提交时不会验证格式。week周选择框默认值为空表单提交时不会验证格式。time时间选择框默认值为空表单提交时不会验证格式。datetime-local日期时间选择框默认值为空表单提交时不会验证格式。
7.视频标签Video
srcURL地址、视频地址width像素值、设置视频播放器的宽度height像素值、设置视频播放器的高度controls向用户显示视频控件(比如播放/暂停按钮)muted视频静音autoplay视频自动播放loop循环播放posterURL地址、视频封面preload视频预加载如果使用autoplay 则忽略该属性。 none :不预加载视频。metadata:仅预先获取视频的元数据(例如长度)。auto:下载整个视频文件即使用户不希望使用它。
8.音频标签audio
srcURL地址、音频地址controls向用户显示音频控件(比如播放/暂停按钮)muted音频静音autoplay音频自动播放loop循环播放preload音频预加载如果使用autoplay 则忽略该属性。 none :不预加载音频。metadata:仅预先获取音频的元数据(例如长度)。auto:下载整个音频文件即使用户不希望使用它。
9.新增全局属性
contenteditable(ture or false)表示元素是否可被用户编辑draggable(ture or false)表示元素可以被拖动hidden隐藏元素spellcheck(ture or false)规定是否对元素进行拼写和语法检查contextmenu规定元素的上下文菜单在用户鼠标右键点击元素时显示。data-*用于存储页面的私有定制数据。
三.兼容性处理
1.添加元信息让浏览器处于最优渲染模式。
!--设置IE总是使用最新的文档模式进行渲染--
meta http-equivX-UA-Compatible contentIEEdge
!--优先使用webkit ( Chromium )内核进行渲染针对360等壳浏览器--
meta namerenderer contentwebkit
2.使用html5shiv让低版本浏览器认识H5的语义化标签。
!--[if lt ie 9]
script src ../sources/js/htm15shiv.js/script ! [endif]--