HTML5基础知识(中)

HTML5基础知识

1. header元素表示页面中的一个内容区块或整个页面的标题。
   header元素是一种具有引导和导航作用的结构元素，通常用来放置整个页面或页面内的一个内容区块的标题，但也可以包含其他的内容，比如在header里面放置logo图片、搜索表单等。
   注意：一个页面内并没有限制header的出现次数，也就是说我么可以在同一页面内，不同的内容区块上分别加上一个header元素。
   在HTML5中，一个header元素至少可以包含一个heading元素（h1-h6），也可以包括hgroup元素，还可以包括其他的元素，在新的w3c HTML5标准，我们还可以把nav元素包括进去。
2. nav元素表示页面中导航链接的部分
3. article元素表示页面中的一块与上下文不相关的独立内容，比如一篇文章中的文章。
4. section元素表示页面中的一块内容区块，比如章节的页眉页脚等，也可以和Hn（H1、H2、H3。。。）等一起使用，表示出文档的结构。
   组成：标题+内容 如果第一section元素中还要包含section子元素那么第一个section元素也不可省。section禁忌：不要使用section元素设置样式作为设置样式的页面容器，那是div的工作。如果nav article aside 更适合使用条件就不要使用section元素，不要没有标题的内容区块使用section元素。
5. aside元素表示article元素的内容之外的，和内容相关的辅助信息。使用方法有2种：1、被包含在article元素中作为主要内容的附属信息部分，其中的内容可以是当前主要内容的参考资料名词解释等。2、在article之外使用的作为页面或全局的附属信息。
6. footer元素表示页面或者页面中的一块区域的页脚，比如存放文件的创建时间、作者、联系方式等
7. time元素中的pubdate属性，pubdate就是表示的当前文章的发布时间。<time datetime="2016-05-16" pubdate="pubdate">2016年5月16日</time>
8. hgroup元素是将标题和他的子标题进行分期的元素。hgroup元素一般会把h1-h6的元素进行分组，比如在一个内容区块的标题和他的子标题算是一组。通常情况下，文章只有一个主标题时，是不需要hgroup元素的.
9. address元素用来在页面中呈现联系信息，包括文档的作者、邮箱、地址、电话信息等。address元素还用来展示和文章中的相关的联系人的所有联系信息。
10. figure元素与figcaption figure元素是一种元素的组合，带有可选标题，figure元素用来表示页面上一块独立的内容，如果将他从网页上删除不给我们的网页造成影响。figcaption元素表示figure元素的标题，它属于figure元素，figcaption元素必须书写在figure元素内部，可以写在figure元素内的其他从属元素前面或后面。一个figure元素内最多只允许放置一个figcaption元素。
11. details元素与summary元素 details元素是一种用于标识该元素内部的子元素可以被展开、收缩显示的元素。details元素具有一个布尔类型的open属性，当该值为true时，该元素内部的子元素应该被展开显示，当该属性值为false时，其内部的子元素应该被收缩起来不现实。该属性的默认值为false，当页面打开时其内部的子元素应该处于收缩状态。 summary元素从属于details元素，用鼠标点击summary元素中的内容文字时，details元素中的其他所有从属元素将会展开或者收缩。如果details元素内没有summary元素，浏览器会提供默认的文字以供点击，例如“details” 。目前只有谷歌的chrome浏览器支持！
12. mark元素表示页面中需要突出显示或高亮显示的，对于当前用户具有参考作用的一段文字。通常在引用原文时使用mark元素，目的是引起读者的注意。mark元素是对原文内容有补充作用的一个元素，他应该用在一段原文作者不认为重要的，但是现在为了与原文作者不相关的其他目的而需要突出显示或者高亮显示的文字上面。mark元素最主要的目的就是吸引当前用户的注意。mark元素除了高亮显示之外，还有一个作用就是在引用原文时，为了某种特殊的目的而把作者没有表示出来的内容重点表示出来。
13. progress元素代表一个任务的完成进度，这个进度可以使不确定的，表示进度Z正在进行，但不清楚这个还有多少工作量没有完成，也可以用0到某个最大数字（比如100）之间的数字来表示准确的进度情况（比如百分比） 该元素具有两个表示当前任务完成情况的属性，value属性表示已经完成了多少工作量，max属性表示总共有多少工作量，工作量的单位是随意的，不指定的。在设定属性的时候，value属性和max属性只能指定为有效的浮点数，value属性必须大于0，且小于或等于max的属性，max的属性必须大于0。
14. meter元素表示规定范围内的数值量。meter有6个属性：1）value属性：表示的是实际值。该属性默认为0，可以为该属性制定一个浮点小数值。2)min属性：指定规定范围时允许使用的最小值，默认0，在设定该属性时所设定的值不能小于0。3）max属性：指定规定范围时允许使用的最大值，如果设定时该属性值小于min的值，那么把min属性的值视为最大值。max属性的默认值为1。4）low属性：规定范围的下限值，必须小于或者等于high的值。5）high属性：规定范围的上限值，如果该属性值小于low属性的值，那么把low属性的值视为high属性的值，同样如果该属性的值大于max属性的值，那么把max属性的值视为high的值。6）optimum属性：最佳值属性值必须在min属性值与max属性值之间，可以大于high属性值。
15. canvsa是h5一个新增重要元素，用来绘制图形的。(在下一篇详细总结canvas)
    1、canvas 标签介绍及绘图环境设置。
    2、常用绘制方法：fillRect() 、strokeRect()、 fill() 、stroke()、arc()
    3、绘图样式设置：fillStyle、strokeStyle、lineWidth、lineJoin、lineCap
    4、路径绘制：beginPath、 colsePath 、moveTo、 lineTo
    5、canvas 转换： translate 、rotate 、scale
    6、像素操作：getImageData() 、putImageData()、createImageData()