figcaption

定义和用法

<figcaption> 标签定义 figure 元素的标题(caption)。

"figcaption" 元素应该被置于 "figure" 元素的第一个或最后一个子元素的位置。

details

定义和用法

<details> 标签用于描述文档或文档某个部分的细节。

目前只有 Chrome 和 Safari 6 支持 <details> 标签。

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<details>
<summary>HTML5CSS3.</summary>
<p>All pages and graphics on this web site are the property of W3School.</p>
</details>
</body>
</html>

只有谷歌浏览器支持

summary

定义和用法

<summary> 标签包含 details 元素的标题,"details" 元素用于描述有关文档或文档片段的详细信息。

mark

定义和用法

<mark> 标签定义带有记号的文本。请在需要突出显示文本时使用 <m> 标签。

<!DOCTYPE HTML>
<html>
<body> <p>Do not forget to buy <mark>milk</mark> today.</p> </body>
</html>

meter

定义和用法

<meter> 标签定义已知范围或分数值内的标量测量。也被称为 gauge(尺度)。

例子:磁盘用量、查询结果的相关性,等等。

注释:<meter> 标签不应用于指示进度(在进度条中)。如果标记进度条,请使用 <progress> 标签。

编排规则

1.显式编排

使用section元素进行分块创建网页,每个内容区块使用标题h1~h6

2.隐式编排

不使用section元素,而是根据我们写的(h1~h6、hgroup等)元素自行创建区块

3.标题分级

不同的标题有不同的级别,h1~h6中h1最高,所以隐式编排的情况下会按照一下规则生成

1).如果出现新的标题比上一个标题级别低,那么会生成下级内容区块。

2).如果新出现的标题比上面出现的标题级别高,或者两者几倍相同,那么会生成新的内容区块。

4.不同内容区块可以使用相同级别的标题

父内容区块与子内容区块都可以使用相同级别的h1标题

HTML5 – 2.新元素的更多相关文章

  1. HTML5——添加新元素 新元素 Canvas SVG MathML 黑客帝国特效

    为HTML添加新元素 添加新元素   +   该元素定义样式 <!DOCTYPE html> <html> <head> <meta charset=&quo ...

  2. 浅谈html5某些新元素的用途

    大家都知道html是一种前端网页语言,从出现到现在已经经历了很多的版本了,但是随着html的不断发展,现在的html5已经不再是单一的前端页面语言了,html,javascript,css不再单纯的只 ...

  3. 【原】HTML5 新增的结构元素——能用并不代表对了

    做移动端有一段时间,今天有同事问了我 article 和 section 标签的使用,模模糊糊的解释了下,他似懂非懂,有点小尴尬.忽然间觉得自己有必要再翻翻书籍,重温下 html5 的新元素.html ...

  4. HTML5和CSS3基础教程(第8版)-读书笔记

    第1章 网页的构造块 一个网页主要包括以下三个部分: n        文本内容(text content):在页面上让访问者了解页面内容的纯文字. n        对其他文件的引用(referen ...

  5. 深入理解HTML5:语义、标准与样式(勇猛精进早登大师殿堂创最优品质交互)

    深入理解HTML5:语义.标准与样式(勇猛精进早登大师殿堂创最优品质交互) [美]布拉德福(Bradford,A.) [美]海涅(Haine,P.)著 高京译 ISBN 978-7-121-20552 ...

  6. Head First HTML5 Programming笔记--chapter1 认识HTML5

    升级到HTML5 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 //EN" "http://www.w3.org/TR/ ...

  7. 深入剖析 HTML5

    作为新一代的 HTML 标准,HTML5 不仅强化了 Web 网页的表现性能,还追加了本地数据库等 Web 应用的功能.虽然 HTML5 标准仍处于完善之中.然而,大部分新版本的浏览器已经能够支持某些 ...

  8. HTML5与CSS3基础教程第八版学习笔记1~6章

    第一章,网页的构造块 网页主要包括三个部分: 1.文本内容(纯文字) 2.对其他文件的引用:图像,音频,视频,样式表文件,js文件 3.标记:对文本内容进行描述并确保引用正确地工作 注:所有这些成分都 ...

  9. HTML5 基础

    1.HTML5 简介 HTML5 是最新的 HTML 标准,他是万维网的核心语言.标准通用标记语言下的一个应用“超文本标记语言”. HTML 的上一个标准 HTML4.01 诞生于 1999年,他的第 ...

随机推荐

  1. 通过Unity3d创建二维码(利用zxing2.2)

    http://blog.csdn.net/liulala16/article/details/14521979 2013-11-08 14:53 1965人阅读 评论(3) 收藏 举报 首先 下载ZX ...

  2. ionic不同view跳转到同一个

    ionic不同view跳转到同一个 view并保留历史的路由设计 上代码:state 里面新加一个状态 .state("other", { url: "/other&qu ...

  3. OSI参考模型与TCP/IP协议模型

    OSI和TCP/IP都是为了计算机之间更好的互联的. 计算机网络是一个复杂的系统,比如两台计算机进行通信不仅仅只是有一条通信线就可以了. 还有很多的工作需要完成,例如: 如何知道对方计算机是否做好准备 ...

  4. 子类重载父类的方法“parent::方法名”转于 恩聪PHP学习教程

    在PHP中不能定义重名的函数,也包括不能再同一个类中定义重名的方法,所以也就没有方法重载.单在子类中可以定义和父类重名的方法,因为父类的方法已经在子类中存在,这样在子类中就可以把从父类中继承过来的方法 ...

  5. win7和ubuntu双系统删除ubuntu的方法

    双系统,一般是先安装win7,再装ubuntu,开机用grub引导.假如装完双系统,某一天又想恢复使用windows怎么办呢? 也许你会说,直接用win7的磁盘管理工具,格式化ubuntu所在磁盘不就 ...

  6. c# Dictionary的遍历和排序

    c# Dictionary的遍历和排序 c#遍历的两种方式 for和foreach for: 需要指定首位数据.末尾数据.数据长度: for遍历语句中可以改变数据的值: 遍历规则可以自定义,灵活性较高 ...

  7. Oracle 11g 下载|Oracle 11g 官网下载|Oracle 11g 官网下载 带登录用户和密码

    本文转载自 Oracle 11g 下载|Oracle 11g 官网下载|Oracle 11g 官网下载 带登录用户和密码 oracle 下载还需要用户名我自己注册了个方便大家使用下载直接点击提示找不到 ...

  8. Java for LeetCode 207 Course Schedule【Medium】

    There are a total of n courses you have to take, labeled from 0 to n - 1. Some courses may have prer ...

  9. a byte of python (摘01)

    a byte of python 第一章 介绍 Python 特色 简单.易学.免费.开源 高层语言.可移植性.解释性 面向对象.可扩展性.可嵌入性 丰富的库 第二章 安装Python http:// ...

  10. MST:Bad Cowtractors(POJ 2377)

    坏的牛圈建筑 题目大意:就是现在农夫又要牛修建牛栏了,但是农夫想不给钱,于是牛就想设计一个最大的花费的牛圈给他,牛圈的修理费用主要是用在连接牛圈上 这一题很简单了,就是找最大生成树,把Kruskal算 ...