如果想在网页中展示有前后顺序的信息列表,怎么办呢?如,当当网上的书籍热卖排行榜,如下图所示。

这类信息展示就可以使用<ol>标签来制作有序列表来展示。

语法:

<ol>
<li>信息</li>
<li>信息</li>
......
</ol>

举例:

下面是一个热点课程下载排行榜:

<ol>
<li>前端开发面试心法 </li>
<li>零基础学习html</li>
<li>JavaScript全攻略</li>
</ol>

<ol>在网页中显示的默认样式一般为:每项<li>前都自带一个序号,序号默认从1开始,如下图所示:

示例:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title> p标签</title>
</head>
<body>
<ol>
<li>Rinpe Chen</li>
<li>Rinpe Chen</li>
<li>Rinpe Chen</li>
</ol> </body>
</html>

ps:

<ol>...</ol> ol是ordered lists的缩写, 表示有序(编号)列表

<ul>...</ul> ul是unordered lists的缩写, 生成无序(没有序号)列表

使用ol,添加图书销售排行榜的更多相关文章

  1. 网络爬虫之定向爬虫:爬取当当网2015年图书销售排行榜信息(Crawler)

    做了个爬虫,爬取当当网--2015年图书销售排行榜 TOP500 爬取的基本思想是:通过浏览网页,列出你所想要获取的信息,然后通过浏览网页的源码和检查(这里用的是chrome)来获相关信息的节点,最后 ...

  2. [翻译 EF Core in Action 2.1] 设置一个图书销售网站的场景

    Entity Framework Core in Action Entityframework Core in action是 Jon P smith 所著的关于Entityframework Cor ...

  3. UML作业第三次:分析《书店图书销售管理系统》

    分析图书销售管理系统 一.概览 PlantUML类图语法学习小结 <书店图书销售管理>的类图元素 绘制类图脚本程序 绘制的类图 二.PlantUML类图语法 1.类之间的关系绘制 示例: ...

  4. SSM开发基于Java EE在线图书销售系统

           SSM(Spring+Spring MVC+MyBatis)开发基于Java EE在线图书销售系统  网站成功建立和运行很大部分取决于网站开发前的规划,因此为了在网站建立过程中避免一些不 ...

  5. 大项目之网上书城(八)——数据库大改&添加图书

    目录 大项目之网上书城(八)--数据库大改&添加图书 主要改动 1.数据库新增表 代码 2.数据库新增触发器 3.其他对BookService和BookDao的修改 代码 4.addBook. ...

  6. UML作业第三次:分析《书店图书销售管理系统,绘制类图

    plantuml类图绘制方法的学习: 1.关于类图的学习: 类图显示了系统的静态结构. 类:类图中的主要元素,用矩形表示.矩形的上层表示类名.中层表示属性.下层表示方法. 类之间的关系:关联.依赖.聚 ...

  7. UML作业第三次:分析《书店图书销售管理系统》,绘制类图

    一. 类图语法学习小结(类间关系的表示方法) 1.抽象类和接口 我们用关键字abstract或abstract class来定义抽象类(抽象类用斜体显示).也可以使用interface,annotat ...

  8. HTML(HTML+CSS基础)

    HTML: 认识html文件基本结构 这一节中我们来学习html文件的结构:一个HTML文件是有自己固定的结构的. <html> <head>...</head> ...

  9. html学习第一天笔记

    语义化,让你的网页更好的被搜索引擎理解在这一章节我们要开始把网页中常用到的标签一 一向大家介绍,学习这一章节的时候要记住学习html标签过程中,主要注意两个方面的学习:标签的用途.标签在浏览器中的默认 ...

随机推荐

  1. hdu 5063 Operation the Sequence

    http://acm.hdu.edu.cn/showproblem.php?pid=5063 思路:因为3查询最多50,所以可以在查询的时候逆操作找到原来的位置,然后再求查询的值. #include ...

  2. C#程序设计基础——类、对象、方法

    类与对象 类 类是一种构造,通过使用该构造,用户可以将其他类型的变量.方法和事件组合在一起,从而创建自定义类型.类就像一个蓝图,它定义类型的数据和行为. 对象 定义类之后,便可通过将类加载到内存中来使 ...

  3. bit、sbin、sfr、sfr16 区别分析

    1.bit 和 sbit 都是 C51 扩展的变量类型. bit 和 int char 之类的差不多,只不过 char=8 位, bit=1 位而已.都是变量,编译器在编译过程中分配地址.除非你指定, ...

  4. win平台下, 检测网络是否连接最好的办法

    [Delphi]检查URL是否有效的函数 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 function CheckUr ...

  5. InnoDB这种行锁实现特点意味者:只有通过索引条件检索数据,InnoDB才会使用行级锁,否则,InnoDB将使用表锁!

    InnoDB行锁是通过索引上的索引项来实现的,这一点MySQL与Oracle不同,后者是通过在数据中对相应数据行加锁来实现的. InnoDB这种行锁实现特点意味者:只有通过索引条件检索数据,InnoD ...

  6. Javascript面向对象编程(三):非构造函数的继承 by 阮一峰

    今天是最后一个部分,介绍不使用构造函数实现"继承". 一.什么是"非构造函数"的继承? 比如,现在有一个对象,叫做"中国人". var Ch ...

  7. QTP自传之对象

    对象在手,测试我有 大家别误会,这里说的对象可不是值指男女朋友,而是对被测控件的识别.经过昨天的录制,大家一定很奇怪为什么我可以做到精确的回放操作,这都要归功于对象,下面就隆重的介绍我在对象识别方面的 ...

  8. 译文链接:http://www.codeceo.com/article/10-truth-programmer-must-know.html

    大多数时候,写代码都是挺有意义的一件事,不光能增加经验值,解决难题的时候还特别爽.耐心.毅力.执着,再加上正确的工具——只要有它们的亲密协作,优雅.漂亮的代码就是手到擒来的事儿. 但是,紧接着拙劣的资 ...

  9. xcode4的workspace里各lib工程与app工程联编之runscript简介

    copy from:http://www.cnblogs.com/xiaouisme/archive/2012/02/06/2339470.html 本文讲解怎么在xcode4的workspace里配 ...

  10. hdoj 1728 逃离迷宫

    逃离迷宫 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...