<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Html5学习之路</title>
</head>
<body>
<header style="text-align: center; color: blue;">欢迎来到Html5的学习之路,我是header标签。</header>
这是一个定义选项列表的标签datalist 这个的作用就是将text文本框与select标签结合起来

<input type="text" list="phone">
<datalist id="phone">
<option></option>
<option>IPhone</option>
<option>华为 </option>
<option>小米 </option>
<option>三星</option>
</datalist>
<br/>
<br/>
<font color="red">这里我发现了两者一个不同之处在于,datalist只有在输入框为空的时候才会有自己定义下拉的内容!</font>
<br/>
而这个select选项框是不管什么内容它都会存在的
<select>
<option>IPhone</option>
<option>华为 </option>
<option>小米 </option>
<option>三星</option>
</select>
<br>
<br>
<br>

------------------------
<br><br><br>
这是一个定义文档细节的标签。detail标签。它的主要作用很简单。
<details>
<summary>这是一个detail标签,下面就是他的使用方法</summary>
<p>detail标签是什么?</p>
<p>detail标签有什么作用?</p>
<p>detail标签能干什么?</p>
<p>detail标签我改怎么用它?</p>
</details>
<br>
detail标签常与sunmmary标签用在一起。比如这个标签是高亮标签<mark>mark</mark>比重不一样。
<br><br>
接下来这个标签是定义列表标签。menu。
<menu>
<li>西游记</li><li>水浒传</li><li>红楼梦</li><li>三国演义</li>
</menu>
<br><br>
进度条标签我们用的比较多。比如这个。<mark>progress</mark>
<progress value="5" max="10">value=5 max=10</progress>
<br>
<audio src="" controls="controls" autoplay="autoplay" loop="loop"></audio>
<footer>我是底部footer标签</footer>
</body>
</html>

H5新增标签的更多相关文章

  1. web语义化与h5新增标签

    Web语义化就是html告诉我们也告诉机器这一块是什么内容,例如:“这行是一个标题,这几行组成一个段落,这是一个列表,那是一个链接.”   Web语义化有三个阶段: 1.h1~h6.thead.ul. ...

  2. h5新增标签及css3新增属性

    - h5新增的标签 新增元素 说明 video 表示一段视频并提供播放的用户界面 audio 表示音频 canvas 表示位图区域 source 为video和audio提供数据源 track 为vi ...

  3. h5新增标签兼容性

    <address> 标签定义文档或文章的作者/拥有者的联系信息.  兼容所有浏览器 <area> 标签定义图像映射中的区域(注:图像映射指得是带有可点击区域的图像).兼容所有浏 ...

  4. H5 新增标签canvas 画布

    canvas是写在body中的标签,设置宽高后,通过JS来往其中绘制想要的内容, canvas可以理解为一个画板,而JS就是你的画笔. 1.获取到画布 var canvas = document.ge ...

  5. h5新增html标签语义

    H5新增常用标签<body> <header>...</header> <nav>...</nav> <article> < ...

  6. H5新增特性之语义化标签

    H5新增特性之语义化标签 语义化标签顾名思义标签有自己的含义,浏览器或者程序员一看就知道是什么.在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式 ...

  7. H5新标签(适合新手入门)

    H5新标签 文档类型设定 document HTML: sublime 输入 html:4s XHTML: sublime 输入 html:xt HTML5 sublime 输入 html:5 < ...

  8. IIS 配置 FTP 网站 H5 音频标签自定义样式修改以及添加播放控制事件

    IIS 配置 FTP 网站   在 服务器管理器 的 Web服务器IIS 上安装 FTP 服务 在 IIS管理器 添加FTP网站 配置防火墙规则 说明:服务器环境是Windows Server 200 ...

  9. H5新增API

    H5新增API 选择器 querySelector()和querySelectorAll(),参数都是css选择器,前者返回符合条件的第一个匹配的元素,如果没有则返回Null,后者返回符合筛选条件的所 ...

随机推荐

  1. 如何抽象一个 Vue 公共组件

    之前一直想写一篇关于抽象 Vue 组件的随笔,无奈一直没想到好的例子.恰巧最近为公司项目做了一个数字键盘的组件,于是就以这个为例聊聊如何抽象 Vue 的组件. 先上 Demo 与 源码.(demo最好 ...

  2. nginx URL重写

    html { font-family: sans-serif } body { margin: 0 } article,aside,details,figcaption,figure,footer,h ...

  3. fatal: The remote end hung up unexpectedly

    git push 的时候出错,提示: fatal: The remote end hung up unexpectedly 遇见几次了,原因是因为文件太大,把限制放宽就好了.命令: git confi ...

  4. UVa1630,Folding

    区间dp,记忆化搜就可以 st为原串 dp[p][q]存st[p]~st[q]的最优长度,f[p][q]存对应的最优串 从(0,len-1)开始搜,f[0][len-1]为所求ans,回溯条件为p== ...

  5. 突发小事件,USB接口问题

    昨天遇到的突发事件,突然USB接口全部瘫了,键盘鼠标全部不能用,换到别人电脑上可以,吓尿了,以为本子主板挂了,但是发现插U盘竟然可以识别而且可以打开,感觉可能是静电问题,果然,彻底关机,拔掉电池,然后 ...

  6. PHP入门,clone和__clone

      前 言 这篇文章主要介绍了PHP编程中的__clone()方法使用详解,__clone()方法相当于一个浅拷贝,是PHP入门学习中的基础知识,需要的朋友可以参考下. 1对象是引用数据类型,当使用= ...

  7. winfrom窗体加载控制台程序,可以自定义输出语句颜色

    winfrom窗体加载控制台程序,可以自定方输出语句颜色,如下图所示 怎么实现的此功能,网上有大把的方法,我这里已经把方法打包成了一个类,只需要引用调用就可以使用了,写的比较粗糙,如有发现需要改进的地 ...

  8. 基于Lua脚本解决实时数据处理流程中的关键问题

    摘要 在处理实时数据的过程中需要缓存的参与,由于在更新实时数据时并发处理的特点,因此在更新实时数据时经常产生新老数据相互覆盖的情况,针对这个情况调查了Redis事务和Lua脚本后,发现Redis事务并 ...

  9. Muduo阅读笔记--base(二)

    上一篇文章对muduo的入门做了介绍. http://www.cnblogs.com/LCCRNblog/p/5668035.html base文件夹下这么多代码,该如何入手呢?对于我这种第一次接触大 ...

  10. 删除链表中倒数第n个节点

    给定一个链表,删除链表中倒数第n个节点,返回链表的头节点. 样例 给出链表1->2->3->4->5->null和 n = 2. 删除倒数第二个节点之后,这个链表将变成1 ...