什么是HTML大纲算法?

大纲算法允许用户代理(user agent)从一个web页面生成一个信息结构目录,让用户对页面有一个快速的概览。类似书籍、PDF、帮助文档等,都有一个清晰的目录结构,用户能方便的定位所需内容。一个良好结构的大纲,不仅是对于搜索引擎的优化,更是为借助于屏幕阅读器浏览网页的盲人(或弱视力)用户提供了巨大的帮助。

帮助文档的目录结构:

我们这里从一个简单的例子入手  比如说我们要做一个书店的网页它的大纲是这样的

图书区域

  1.经管励志

    《活法》

    《执行力》

    《永远不放弃》

  2.文学经典

    《钢铁是怎样炼成的》

    《一千零一夜》

HTML5大纲

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="gbk">
<title>HTML5大纲</title> <style> </style>
<body>
<h1>图书区域</h1>
<section>
<h1>经管励志</h1>
<article>
<h1>《活法》</h1>
</article> <article>
<h1>《执行力》</h1>
</article> <article>
<h1>《永不放弃》</h1>
</article> </section> <section>
<h1>文学经典</h1>
<article>
<h1>《钢铁是怎样炼成的》</h1>
</article>
<article>
<h1>《一千零一夜》</h1>
</article>
</section>
</body>
</html>

  

HTML5大纲算法的更多相关文章

  1. html5大纲算法(目录树)

    看了<CSS那些事儿>我一直遵循着给每个板块写一个h标签,并保持层次,比如导航条.焦点图我都写了一个缩进隐藏的h标签.这种规范一般人根本看不出来,即使是行内的大多数人也觉得没有必要.可是我 ...

  2. html5--6-68 实战前的准备工作:了解HTML5大纲算法

    html5--6-68 实战前的准备工作:了解HTML5大纲算法 学习要点 了解HTML5大纲算法 在html5中有一个很重要的概念,叫做HTML5大纲算法(HTML5 Outliner),它的用途为 ...

  3. 第八十七节,html5+css3pc端固定布局,大纲算法,section和div,结构分析

    html5+css3pc端固定布局,大纲算法,section和div,结构分析 一.大纲算法 在HTML5中有一个很重要的概念,叫做HTML5 大纲算法(HTML5Outliner),它的用途是为用户 ...

  4. HTML5区块和大纲算法

    原文链接: Using HTML sections and outlines - Mozilla Developer Network 每集HTML5+CSS3网页布局教程-2大纲算法 HTML5标准带 ...

  5. html5大纲

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

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

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

  7. HTML5开发规范

    1.总体规范——采用html5的结构标签进行页面布局,注意结构的语义化,并注意页面大纲的层级结构.使用css3.0进行样式的设计. a.网页大纲查询网址http://gsnedders.html5.o ...

  8. 深入理解HTML5:语义、标准与样式

    <深入理解HTML5:语义.标准与样式> 基本信息 作者: (美)布拉德福(Bradford,A.) 海涅(Haine,P.) 译者: 高京 出版社:电子工业出版社 ISBN:978712 ...

  9. 第 31 章 项目实战-PC端固定布局[2]

    学习要点: 1.大纲算法 2.section和div 3.结构分析 主讲教师:李炎恢 本章主要开始使用学习用HTML5和CSS3来构建Web页面,第一个项目采用PC端 固定布局来实现. 一.大纲算法  ...

随机推荐

  1. 利用Docker搭建开发环境

    一. 前言 随着平台的不断壮大,项目的研发对于开发人员而言,对于外部各类环境的依赖逐渐增加,特别是针对基础服务的依赖.这些现象导致开 发人员常常是为了简单从而直接使用公有的基础组件进行协同开发,在出现 ...

  2. NCEP数据资料获取 地面抬升指数

    先放上数据地址:https://www.esrl.noaa.gov/psd/data/gridded/data.ncep.reanalysis.surface.html 美国国家环境预报中心(NCEP ...

  3. Helium文档2-WebUI自动化-常用方法介绍

    学习思路: 查看github项目的源码,每个方法都有介绍及使用说明 https://github.com/mherrmann/selenium-python-helium/blob/master/he ...

  4. Linux文件系统和管理-2文件操作命令(下)

    移动和重命名文件 mv 命令可以实现文件或目录的移动和改名 剪切的效果 同一分区移动数据,速度很快:数据位置没有变化 不同分区移动数据,速度相对慢:数据位置发生了变化 格式 和cp基本一样 mv [O ...

  5. 深入理解Java的抽象类和接口

    对于面向对象来说,抽象是其重要特征之一.对于之中的抽象类和接口,两者有很多相似的地方,又有两者之间区别的地方. 用几个简单的例子让你快速的理解两者之间的概念和区别 鸣谢 一.抽象类 在了解抽象类之前, ...

  6. E. Tree Reconstruction 解析(思維)

    Codeforce 1041 E. Tree Reconstruction 解析(思維) 今天我們來看看CF1041E 題目連結 題目 略,請直接看原題 前言 一開始完全搞錯題目意思,還以為每次會刪除 ...

  7. D. Concatenated Multiples 解析(思維)

    Codeforce 1029 D. Concatenated Multiples 解析(思維) 今天我們來看看CF1029D 題目連結 題目 給你一個序列\(a\)和一個數字\(k\),求有幾種ind ...

  8. 关于oracle监听程序的相关问题及解决方法

    1.查看监听程序是否启动 打开cmd窗口,cmd用管理员运行,否则无法执行启动与停止监听命令 lsnrctl status查看运行状态 lsnrctl stop停止监听 lsnrctl start启动 ...

  9. LuoguP3615 如厕计划

    题面 现有两个厕所,一个女士专用,一个通用,给出\(2*n\)个排成一列的人的性别 每人如厕需要一分钟,假如女厕是空的,女生中最靠前的可以直接进入. 需要通过调换顺序使得所有人都上完厕所最后的时间为n ...

  10. Learn day4 函数参数\变量\闭包\递归

    1.函数描述 # ### 函数 """ (1)函数的定义: 功能 (包裹一部分代码 实现某一个功能 达成某一个目的) (2)函数特点: 可以反复调用,提高代码的复用性,提 ...