H5新增语义化标签
一、根据页面的结构，由div派生的标签。
<header>
<footer>
<nav> 导航 在H4中导航栏一般用ul-li标签，H5中可以直接用<nav>标签
eg. <nav> <a href="#">导航标题1 </a> <a href="#">导航标题2 </a> </div>
<hgroup> 页面上得一个标题组合（一个标题和一个子标题）
eg, <hgroup> <h1>博客园</h1>
<h2>博客园是一个开发者分享资源的好地方</h2>
</hgroup>
<section> 用来划分页面上的不同区域
<article> 用来表示页面上一套结构完整且独立的内容部分
<aside> 和主题相关的附属信息
二、媒体元素组合
<figure>和 <figcaption>：<figure>为父元素，用于图片的外层，其子元素<figcaption>用来对内容进行说明。
三、<time>标签，专门用来表示时间
四、<datalist> 标签，定义选项列表。与 input 元素配合使用该元素，来定义 input 可能的值。
datalist 及其选项不会被显示出来，它仅仅是合法的输入值列表。
请使用 input 元素的 list 属性来绑定 datalist。
<input id="myCar" list="cars" />
<datalist id="cars">
<option value="BMW">
<option value="Ford">
<option value="Volvo">
</datalist>
五、<details> 标签，用于描述文档或文档某个部分的细节。
与<summary>标签配合使用可以为 details 定义标题。标题是可见的，用户点击标题时，会显示出 details。
<details>
<summary>Copyright 2011.</summary>
<p>All pages and graphics on this web site are the property of W3School.</p>
</details>
六、<address> 标签，定义文档或文章的作者/拥有者的联系信息。
<address> 元素中的文本通常呈现为斜体。大多数浏览器会在 address 元素前后添加折行。
七、<mark> 标签，定义带有记号的文本。在需要突出显示文本时使用 该 标签，默认加黄色背景。
八、<keygen> 标签，规定用于表单的密钥对生成器字段。（用于给表单添加公钥）
当提交表单时，私钥存储在本地，公钥发送到服务器。
<form action="/example/html5/demo_form.asp" method="get">
用户名：<input type="text" name="usr_name" />
加密：<keygen name="security" />
<input type="submit" />
</form>
九、<process>标签，定义进度条
<!DOCTYPE html>
<html>
<body>
下载进度：
<progress value="22" max="100">
</progress>
<p><b>注释：</b>Internet Explorer 9 以及更早的版本不支持 <progress> 标签。</p>
</body>
</html>
H5标签的兼容性
ie6/7不兼容h5标签，解决方法。
1.通过使用JS动态创建
<script>
document.creatElement("header")
</script>
注意：IE6是不识别header等标签的，所以认为是自定义标签。而自定义标签是内联元素，所以要显示一些效果，需要在选择器中加入display:block;
2.这样做比较麻烦，需要创建多个标签
因此我们可以引入一个h5的文件即可
<script src="js/html5shw.js"> </script>
H5新增语义化标签的更多相关文章
- 浅谈html语义化标签,Html5新增语义化标签
Html语义化标签,Html5新增语义化标签 自己在学习的期间,整理了下html关于语义化标签的一些知识,列的不是很全. 希望大家有新的见解可以给我留言,我会补充上去,谢谢大家 1.什么是语义化标签? ...
- H5的语义化标签(PS: 后续继续补充)
头部信息 <header></header> 区块标签 <figure> <figcaption>123</figcaption> < ...
- html5新增语义化标签
注意:body.section.nav 需要h1-h6. div.header则不需要. 1):<article> 显示一个独立的文章内容. 例如一篇完整的论坛帖子,一则网站新闻,一篇博客 ...
- HTML5 部分新增语义化标签元素
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- H5新增特性之语义化标签
H5新增特性之语义化标签 语义化标签顾名思义标签有自己的含义,浏览器或者程序员一看就知道是什么.在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式 ...
- Html5新增的语义化标签（部分）
2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,html5的标准规范终于制定完成.这是互联网的一次重大变革,这也许是一个时代的来临! 总结一些h5新增的语义化标签,记录下来方便自己学习 ...
- 笔记二:常用的h5语义化标签
0.前言: 所谓语义化标签就是一种 我们仅通过标签名就能判断出该标签内容的语义的标签,见名知意. 总结这部分内容,主要是为了能从繁琐的div嵌套div中,改成带有h5标签码.这样更有利于读写代码. 人 ...
- HTML 语义化标签-新增标签介绍
HTML 基础知识 版权声明:未经博主授权,内容严禁转载 ! HTML语义化标签概念 如果没有语义化标签,上面这些 div 都是没有实际意义的,只是我们提供给浏览器的指令. 和 语义化 代码对比: 什 ...
- H5中的语义化标签
H5中的语义化标签也就是之前的id = “header”演变而来的 只不过之前是id 现在变成了标签而已 什么是语义化: 根据内容结构化(内容语义化) 选择合适的标签(代码语义化) 便于开发者阅读和写 ...
随机推荐
- 联想一体机怎么设置u盘启动|联想一体机bios改U盘启动方法（转）
本文转自:http://www.xitongcheng.com/jiaocheng/xtazjc_article_29090.html 所需工具: 1.联想Lenovo品牌一体机 2.启动U盘:大白菜 ...
- Linux命令（十七） 关机命令
在 Linux 系统下一些常用的关机/重启命令有 shutdown.halt.reboot以及init,他们都可以达到重启系统的目的,但每个命令的内部工作过程不同. 一.使用 shutdown 关机或 ...
- Linux下利用json-c从一个json数组中提取每一个元素中的部分字段组成一个新json数组
先把代码贴上来,有时间整理一下 首先说一下要实现的功能: 假定现在有一个json格式的字符串,而且他是一个josn中的数组,比如: [ { "id": "NEW20170 ...
- du 显示 前面以及或者两级的目录大小的方法
mark 一下 du -h --max-depth=
- Delphi中Form的position属性与代码自定义窗体位置
通过Form的Position属性可设置窗体的初始位置,如选择DesktopCenter为桌面中心,ScreenCenter为屏幕中心,等等. 这个属性在很多时候简化了程序代码. 但是,如果设置了po ...
- Eclipse中项目上有小红叉，但就是找不到报错文件（总结，持续更新）
1.jdk问题解决:jdk配置参考:http://blog.csdn.net/superit401/article/details/72847110 2.build path:项目右键——Build ...
- 【BZOJ1296】[SCOI2009]粉刷匠（动态规划）
[BZOJ1296][SCOI2009]粉刷匠(动态规划) 题面 BZOJ 洛谷 题解 一眼题吧. 对于每个串做一次\(dp\),求出这个串刷若干次次能够达到的最大值,然后背包合并所有的结果即可. # ...
- 安利一个很火的 Github 滤镜项目
安利一个很火的 Github 滤镜项目 园长 1 个月前 简评:通过深度学习,一秒钟让你的照片高大上,这是康奈尔大学和 Adobe 的工程师合作的一个新项目,通过卷积神经网络把图片进行风格迁移.项目已 ...
- Appium+python自动化获取toast消息（windows版）的方法
原来用的Appium1.5.3GUI版本,那为什么升级呢? 为了兼容最新版本的iOS10和Android7 Xcode8升级后,将不支持使用UIAutomation,而是改为使用XCUITest了,并 ...
- 960CSS框架，之前有用过 了解下框架基本原理
http://blog.sina.com.cn/s/blog_8173443e010160b8.html CSS框架已经出现很长时间了,关于这些框架的用处也被我们讨论了很多遍了.有人说,CSS框架不够 ...