html与html5标签总结

html:     

一些太常见的就不写了比如div, a, p这类的

meta标签:    

• 属性:
  • keywords:    关键字, 搜索优化
  • description:   描述, 也是优化搜索

列表:

   ul > li

   ol > li

   dl > dt > dd   

分帧:    一个网页包含另一个网页

• iframe标签:  
  • src
  • frameborder:  边框有无3d效果( 0 / 1)
  • scrolling:  滚动条是否显示( no/yes/auto )
  • name: 相当于本网站的一个名字
• frameset标签:  代替body
  • 子标签frame

表格:

    th:  表头

    table > tr > td: 基本表格: 

    属性: rowspan  跨行合并

                colspan    跨列合并

表单:        

 form:   功能性标签

  属性:

        method:     提交的方法

• v:     post | get
  

      action:  提交的位置   

input:  用于搜集用户信息

     type:  

           text文本框、password密码框 、radio单选 、checkbox多选 、button按钮 、submit提交按钮 、file文件上传 、image图片作为提交按钮 、 reset重置按钮。

      type:  html5新增

             tel电话 、url网址 、email邮箱 、search搜索    

            新增带有控件的type:  date日期 、time时间 、color颜色

     属性: 

            checked:  是否选中表单

                    v:  checked选中 |  disabled 不可被选中

      属性: h5新增

              placeholder: 表单内的默认文字

            pattern: 验证输入的值是否符合格式, v: reg

            required: 此表单必填, v: required | 无

            autofocus:  默认获得焦点,v: autofocus | 无

            width: 宽

            height: 高

label:  文本绑定单选标签或多选标签

textarea:   文本域

        属性: cols列 & rows行

select > option:  下拉菜单

        属性: selected 默认被选中,v: selected 

表单的智能感应:   h5新增

     input[type="text"   list=" city "] +   datalist[id=" city"] > option[value="biejing"]{北京}  

h5新增标签                    

文档提纲标签: 

header: 头部

footer: 尾部

section: 区域

article:  文章

aside: 侧边栏

nav: 导航条

语义功能标签:

template:  模板(不会在页面上显示,对于冒号有bug)

figure:   规定独立的流内容（图像、图表、照片、代码等等）

embed:  定义外部交互内容或插件。如: flash,avi,swf等

h5的储存:

本地存储:  存取的都是字符串,只能以k,v对的形式存储,存储的数据没有时间限制     

localStorage.setItem(k,v):  存储数据,只能以k,v对的形式存储

localStorage.getItem(k):   得到数据

l ocalStorage.removeItem("tKey"):  删除 本地存储

localStorage.clear():   批量删除数据

会话存储:  针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。

sessionStorage.setItem(k,v):  会话存储

sessionStorage.getItem(k):    得到数据

h5的音频和视频:

video:  插入MP4格式或ogv等格式文件

        属性: 

            src: 视频地址

            width、height: 视屏宽高

            autoplay: 自动播放, 无v

            controls:  显示播放按钮, 无v

            loop: 自动循环, 无v

        事件: onpause暂停播放 & onplay播放

        方法: pause():暂停 & play()播放

embed: 插入插件, 如flash、avi、wma等格式文件.兼容所有浏览器

分帧:

• iframe:  可以理解为在页面中的另一个页面
  • 属性:
    • frameborder: 边框有无3D效果, v: 0 | 1
    • scrolling:  是否有滚动条, V: yes | no