<!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. Quartz格式设置说明

    这些星号由左到右按顺序代表 :     *    *     *     *    *     *   *                                             格式 ...

  2. php代码常见错误详解整理

    错误类型: 一.未使用二进制上传   代码:    Fatal error: This encoded file is corrupted. Please refer to http://www.ze ...

  3. Centos7安装后出现please make your choice from '1' to e 解决方式

    [输入"1",按Enter键   输入"2",按Enter键    输入"q",按Enter键    输入"yes",按 ...

  4. MapReduce-实践1

      MR进阶实践1:  -file 分发多个文件 [-file 适合场景]分发文件在本地,小文件 -file分发原理         run.sh文件: 通过多个-file, 将多个本地文件分发到Ha ...

  5. 处理MySQL服务器无法启动的问题

    MySQL数据库在升级到5.7版本后,和之前的版本有些不一样,没有data文件夹,我们都知道MySQL数据库文件是保存在data文件夹中的,网上有人说把5.6版本的data文件夹拷贝一个,这种说法听听 ...

  6. [PGM] Bayes Network and Conditional Independence

    2 - 1 - Semantics & Factorization 2 - 2 - Reasoning Patterns 2 - 3 - Flow of Probabilistic Influ ...

  7. PyQt5安装目录中找不到designer.exe与pyrcc5.exe

    我安装的是PyQt5的5.9版本,在安装目录下找不到designer.exe文件.在摸索一段后发现5.9版本对库文件和相关的开发工具是分开发布的.QtDesigner是在pyqt5-tools的包里. ...

  8. trait与policy模板应用简单示例

    trait与policy模板应用简单示例 accumtraits.hpp // 累加算法模板的trait // 累加算法模板的trait #ifndef ACCUMTRAITS_HPP #define ...

  9. 2015-2016 ACM-ICPC, NEERC, Southern Subregional Contest A Email Aliases(模拟STL vector+map)

    Email AliasesCrawling in process... Crawling failed Time Limit:2000MS     Memory Limit:524288KB     ...

  10. Maven合并多个war包的工程需要用到的插件

    <build> <finalName>WebSite</finalName> <plugins> <!-- 配置war包合并的插件 --> ...