在使用 互联网 的时候，我们基本上离不开 浏览器 ( browser ) 。 浏览器其实可以看作一个 中间人，他将 用户无法理解、看不太懂的 脚本语言描述的程序，转换为 用户可以看得到的界面、接收用户的输入 输出动作，并通过执行脚本程序给出对应的反馈。 一般，我们把前面的 “转换为界面” 过程称作 “渲染” (render)。 在上一章中，我们在 .html 文件中填写了代码，在浏览器中打开这个文件，看到了界面，我们姑且称这个“渲染”动作为“静态渲染”，那么这一章中，我们将会看到另外一种“动态渲染”。
接口可以理解为能够让另外的代码、模块调用的函数、对象；
分装即就是将可以重复使用或功能联系紧密的若干代码聚合在一个可以被 调用 或 访问的模块中；
在程序开发过程当中，我们一般会提到“接口”，“封装”等等概念。我理解，提出这些概念的目的，其实是在告诉我们，将程序写的更“清晰”一些。这个“清晰”一般可以描述为两方面：
功能完整 - 实现某个功能应该做些什么事情？如果要做这个事情，是不是可以有不同的做法？ 分工明确 - 某个功能应该在哪里做？代码写在哪里？定义“接口”，即就是将完整的、能够重复使用的“功能”包装（封装）成函数、对象，并供其他逻辑 或 在其他地方调用；使用者并不需要了解“接口”内部具体的实现逻辑，只需知道接口“形式”即可使用，完成对应的功能，同时使用者 不需要对其不需了解的事情加以干涉 。我们下面也会封装、实现一些简单的接口来介绍上面的概念。
排行榜的结构按照网页的开发方式，我一般习惯按照“基本结构”->“外观润色”->“行为功能”这个流程进行进行开发。首先，在排行榜（上一章中 (3) 的位置）加入下面“基本结构”的 HTML 代码：
排行榜 # 姓名 用时
在 HTML 中描述一个表格，使用 标签，并用 来表示一行， 或 分别来表达 表头和表体 中的单元格。
上面元素对应的属性 class 中使用的对应内容，可暂不关心（有兴趣的同学，可以 参看 中文 或 英文 的文档）
上述代码我们建立了一个基本的“表”，并为表体元素起名为 rank_table 便于将来对其进行操作（如，加入实际展示的数据，刷新排行榜等）。
因为我们对上层
元素设置了 text-align: center 居中对齐，表格对齐（标题被设置为左对齐了，内容区域是居中对齐的）有点乱，需要加入下面 CSS 样式（ minesweeper.css 文件中）：
.block.rank .table tbody td { /* 排行榜表格内容居左(由于上层元素设置了 居中) */ text-align: left; /* left - 左对齐 right - 右对齐 center - 居中 */}
CSS 中存在样式的“继承”，即父级元素设置的样式，如果适用的化，会被“继承”应用的子元素上。
所谓适用的样式有很多，例如 字体名 font-family 、字体大小 font-size 、颜色 color ，当然也存在一些特殊情况，这些属性不会被继承，例如：
这个 A 标签的颜色不继承
查看更多关于（二）排行榜（定义和使用函数、对象）-扫雷网页小游戏_html/css_WEB-ITnose的详细内容...