H5学习笔记

1.section:页面中的一个内容区块,比如章节、页眉、页脚或页面中的其他部分;可以与h1、h2、h3、h4、h5、h6等结合使用,标示文档结构;

不要将section元素用作设置样式的页面容器,那是div的工作;如果article元素、aside元素或nav元素更符合使用条件,不要使用section元素;不要为没有标题的内容区块使用section元素。

2.article:页面中的一块与上下文不相干的独立内容,如博客中的一篇文章或报纸中的一篇文章;

article可以看做是一种特殊的section。section强调分块或分段,而article强调独立性。如果一块内容相对来说比较独立、完整的时候,应该使用article,但是如果想将一块内容分成几段的时候,应该使用section元素。div元素变成了一种容器,当使用css样式的时候,可以对这个容器进行一个总体的css样式的套用。

3.aside:article元素的内容之外的、与article的内容相关的辅助信息;

4.header:页面中一个内容区块或整个页面的标题;

5.hgroup:用于对整个页面或页面中一个内容区块的标题进行组合;

6.footer:整个页面或页面中一个内容区块的脚注。一般来说,包含创作者的姓名、创作时间日期以及作者联系信息;

7. nav:页面中的导航链接的部分;

nav的使用场合主要是:传统导航条、侧边导航条(将页面从当前文章或当前商品跳转到其他文章或其他商品页面上去)、页内导航(在本页面几个主要的组成部分之间进行跳转)、翻页导航(在多个页面的前后页或博客网站的前后篇文章滚动)、也可以是其他认为是重要的基本的导航链接组中;
        在H5中不要用menu元素替换nav元素。menu元素使用在一系列发出命令的菜单上的,是一种交互性的元素(在web应用程序中使用的)。

8.figure:一段独立的流内容,一般表示文档主体流内容的一个独立单元。使用figcaption元素为figure组添加标题;<figure></figure>类似于<dl></dl>;

9.video:定义视频,如电影片段或其他视频流;类似于object元素

10.audio:定义音频,如音乐或其他音频流;类似于object元素

11.embed:用来插入各种多媒体,格式可以是Midi、wav、aiff、au、mp3等;

12.mark:主要用来在视觉上向用户呈现那些需要突出显示或高亮显示的文字。比较典型的应用是在搜索结果中向用户高亮显示搜索关键字;

13.progress:运行中的进程,可以用来显示JS中耗时间的函数的进程;

14.time:日期或时间,或同时表示两者;

15.ruby:注释(中文注音或字符);

          rt:表示字符(中文注音或字符)的解释或发音;
         rp:定义不支持ruby元素的浏览器所显示的内容;

例子:<ruby>義<rt> <rp>(</rp>weh<rp>)</rp></rt></ruby>

16.wbr:软换行。浏览器窗口或父级元素的宽度足够宽时,不换行;而当宽度不够时,主动在此换行。对字符型的语言作用大,对中文貌似没多大用处。

17.canvas:表示图形,比如图表和其他图像。本身没行为,仅提供一块画布,它把API展现给JS,以使脚本能够把像绘制的东西绘制到这块画布上。

18.command:命令按钮,比如单选按钮、复选框或按钮。

19.details:用户要求得到并且可以得到的细节信息。可以与summary元素配合使用。summary提供标题或图例。标题是可见的,用户点击标题时,会显示出细节信息。summary应该是details的第一个子元素。

20.datalist:可选数据的列表,与input元素配合使用,可以制作出输入值的下拉列表。

21.datagrid:可选数据的列表,它以树形列表的形式来显示。

22.Keygen:生成密钥;

23.output:不同类型的输出,如脚本的输出;

24.source:为媒介元素(如video和audio)定义媒介资源;

25.menu:菜单列表。当希望列出表单控件时使用该标签;

26.input元素的新增类型:

a.email:必须输入email地址的文本输入框;
b.url:必须输入url地址的文本输入框;
c.number:必须输入数值的文本输入框;
d.range:必须输入一定范围内数值的文本输入框;
e.Date Pickers:H5拥有多个可供选择的日期和时间的新型输入文本框:
                   date-选取日、月、年
                month-选取月、年
                  week-选取周、年
                   time-选取时间(小时和分钟)
             datetime-选取时间、日、月、年(UTC时间)
     datetime-local-选取时间、日、月、年(本地时间)

时间: 2024-10-15 08:30:40

H5学习笔记的相关文章

8.3 H5学习笔记

隐藏域 <form action="" method="post" enctype="multipart/form-data"> <input type="file" name="file"> </form> 注意: 利用这项功能是,在form标签中要指定method属性.要把method指定为post,enctype属性指定为multipart/form-data. 说

h5学习笔记:Table

编写一个表格作为练习.当中有个比较重要的样式在学习过程中遇到,border-collapse: collapse; 能够去除双重的边框.table可以合并单元格所以 对td属性设置 colspan="2" 则代表可以设置单元格. table 当中thead, tbody, tfoot 都是table元素.使用thead代表表头 ,这个标签好处的无需关系位置.同样tfoot 也一样. .mytable tr:nth-child(2n) 为隔开选取,这样就能够间隔地处理错开的颜色. <

h5学习笔记:vuethink 配置

vuethink 是一款基于PHP TP5和Vuejs 结合的后台框架,设计起来是使用较为前沿.在使用的过程,需要对这款开源的后台做一些调整和面对一些细节的坑.前段时间也因为有项目需求,所以下载了玩了一下.好,下面看看如何安装使用. 1 下载源代码 进入到官网 到到这个网页进行下载. 下载完成后,这款后台是前后端分离,基于PHP开发,以及是Vuejs,解压后会frontEnd 和php两个安装包.forntEnd是前端开发包,php是后端开发代码包. 2 安装依赖库 下载的vuejs代码包是没有

sass个人学习笔记

Materliu 在慕课的视频: http://www.imooc.com/learn/364 . http://www.imooc.com/wiki/371 sass入门:http://www.w3cplus.com/sassguide/ 个人先看了 <Sass与Compass实战>(Materliu 是中文翻译之一)后看的视频,看书的时候不是很了解看了视频之后又看了一遍书终于少许了解sass了 下面是我个人对<Sass与Compass实战>这本书学习笔记总结,有些是个人极端自我

bootstrap学习笔记一: bootstrap初认识,hello bootstrap(下)

这一篇主要是补上源码,开始之前请先回顾:bootstrap学习笔记一: bootstrap初认识,hello bootstrap(上) 首先,我们的页面要求, lang,charset等就不用说了,老html属性, viewport是h5的属性,目的是 width=device-width 铺满设备宽度, initial-scale=1正常比较 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta c

html+css学习笔记 2[标签]

img标签/a标签 <img src="图片地址" alt="图片名"/>  图片(单标签)alt属性 是图片名字,是给百度搜索引擎抓取使用:     a标签: 链接/下载/锚点 href地址等于标签id     target 链接打开方式     blank  新窗口     self     当前窗口     <base target="_blank"/> 定义页面链接默认打开方式   常见标签 div        

struts2学习笔记(7)------------ognl表达式

OGNL表达式(Object-Graph Navigation Language),大概可以理解为:对象图形化导航语言.是一种可以方便地操作对象属性的开源表达式语言. Struts2自行维护一个特定范围的"银行",Action将数据放入其中,而JSP页面可从中取数据,表面上似乎看起来像是jsp可以直接访问Action数据.. 当Action属性不再是简单的值,而是某个对象,数组,集合时,就需要使用ognl表达式来访问这些对象,数组,集合内的数据了. 1)ognl的stack Conte

Html5学习笔记1 元素 标签 属性

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML5学习笔记</title> </head> <body bgcolor="#90ee90"> 1.Html5的元素<br/><br/> 元素指的是从開始标签到结束标签的全部代码<

学习笔记(一)HTM标签

学习笔记(一)HTML基础知识 HTML:超文本标记语言(Hyper Text Markup Lanuage) HTML就是砌墙,把适当的砖块摆在合适的位置,就能完成一个页面. (一)网页文件命名: a.不可以用中文 b可以使用英文或数字,也可以用拼音,但不要中西合并. c.大小写问题:windowzz操作系统不区分大小写,Linux区分大小写, 所以要求统一区分大小写. d.后缀名必须是html. e.声明html文件时, 最好不要使用特殊数字符,可以用减号或下划线. (二)基本框架: bod