@wulechuan/css-stylus-markdown-themes 7.5.0 → 7.6.1

package/ReadMe.md

@@ -1,6 +1,7 @@
+# 吴乐川的 HTML 文章排版与配色之方案集
+
 <link rel="stylesheet" href="./源代码/发布的源代码/文章排版与配色方案集/层叠样式表/wulechuan-styles-for-html-via-markdown--vscode.default.min.css">
 
-# 吴乐川的 HTML 文章排版与配色之方案集
 
 > 中国人——特别是汉族人，理应坚持广泛、规范地使用汉语。凡非必要之情形不说外国话、不用外国字。此乃天经地义！然则每当必要，亦不排斥采用外国之语言。不妨 **博世界之学问，养中国之精神** 。
 >
@@ -10,7 +11,7 @@
 
 ## Multilingual Editions of this Article
 
-- [English version of this ReadMe](./文档集集/说明书/en-US/ReadMe.md)
+- [English edition of this ReadMe](./文档集集/说明书/en-US/ReadMe.md)
 
 
 
@@ -29,17 +30,39 @@
 </dl>
 
 
+
+
+
+## 源代码仓库
+
+| <span style="display:inline-block;width:180px;">提供仓库服务之组织</span> | <span style="display:inline-block;width:150px;">仓库组织之国别</span> | 仓库地址 |
+| ------------- | :----------: | ------- |
+| 码云           | 中华人民共和国 | [https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns](https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns) |
+| 阿里云之代码仓库 | 中华人民共和国 | [https://code.aliyun.com/wulechuan/wulechuan-themes-for-htmls-via-markdowns](https://code.aliyun.com/wulechuan/wulechuan-themes-for-htmls-via-markdowns) |
+| GitHub         | 美           | [https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns](https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns) |
+
+
+
 ## 此物何用
 
-本工具用于构建一组层叠样式表（即 CSS ）文件，本工具亦提供了一组现成的层叠样式表文件。凡这些样式表，均可用于美化采用超文本标记语言（即 HTML ）格式存储的文章。且不必同时取用多个样式表文件，仅取其一足矣。
+本工具提供两类基本功能。且二者紧密相关。
+
+1.  本工具用于构建一组层叠样式表（即外国话所谓 CSS）文件。
 
-本品还额外提供了一个很小巧的 JavaScript 接口，使得其它 JavaScript 工具包亦可较方便地以程序化之方式使用这些层叠样式表（ CSS ）文件之内容。详见下文《[以程序化之方式取用本工具提供之内容](#以程序化之方式取用本工具提供之内容)》一节。
 
-**于开发者而言，本品亦是一个构件工具，用于相对方便地构建出新的 CSS 文件，以便诸君自定义 HTML 文章之样式。**
+2.  本工具亦提供了一组现成的层叠样式表文件。
 
+凡这些样式表，不论是本工具现成提供的还是开发者采用本工具自己创建的，均可用于美化采用超文本标记语言（即 HTML）格式的文章。于任一文章，不必同时取用多个样式表文件，仅取其一足矣。
 
+本品还提供了一个 JavaScript 编程接口，使得其它 JavaScript 工具包亦可以程序化之方式使用这些层叠样式表文件之内容。详见下文《[以程序化之方式取用本工具提供之内容](#以程序化之方式取用本工具提供之内容)》一节。
 
-## 文档集章节
+
+> 不妨强调，于开发者而言，本品可以是一个样式表**构建工具**，用以相对方便地构建出新的符合特定喜好或需求的样式表文件。
+
+
+
+
+## 文档集
 
 > 以下章节均存在于单独的文件中，并非本文章之部分。
 
@@ -54,71 +77,112 @@
 
 ## 应用效果示例
 
-一图胜千言。以下各图展示了一篇应用了本工具之默认 CSS 样式的文章之样貌。
+本工具配备了两篇范文，汉语一篇，英语一篇，均套用了本工具之默认样式，以示效果。
+
+### 已转换为 HTML 格式的范文副本
+
+范文之截图可以较好地展示文章之（视觉层面的）样貌。但截图文件往往较大，有些竟在**百万字节**级别。因此，不妨在此先给出 HTML 文件。截图在后文也会一并给出。
+
+
+HTML 范文如下：
+
+-   《[HTML 范文（汉语版，浅色）](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/html/example.zh-hans-cn.default-light-colored-theme.html)》
+-   《[HTML 范文（汉语版，深色）](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/html/example.zh-hans-cn.default-dark-colored-theme.html)》
+-   《[HTML 范文（英语版，浅色）](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/html/example.en-us.default-light-colored-theme.html)》
+-   《[HTML 范文（英语版，深色）](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/html/example.en-us.default-dark-colored-theme.html)》
+
+
+
+### HTML 范文的截图
+
+一图胜千言。以下将给出范文之截图。
+
+> 以下各图较大，文件大小在**百万字节**级别。若网络不佳不便阅图，亦可改为下载 HTML 文件观察其面貌。见上文《[已转换为 HTML 格式的范文副本](#已转换为%20HTML%20格式的范文副本)》。
+
+
+#### 范文富有特色的大幅截图
 
-> 以下各图较大，文件大小在 **百万字节** 级别。
 
-### 应用默认浅色主题的范文截图
+1.  应用了**默认浅色主题**的范文之截图
 
-- [示例：简体中文范文配默认浅色主题，在宽大尺寸浏览器中的效果（目录已收叠）](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例：简体中文范文配默认浅色主题，1-在宽大尺寸浏览器中的效果（目录已收叠）.png)
-- [Snapshot: In default light-colored theme, in a wide window, with toc collapsed](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/example_en-US_default-light-colored-theme_1-in-a-wide-window_with-toc-collapsed.png)
+    -  《示例：简体中文范文配默认**浅色**主题，在宽大尺寸浏览器中的效果（目录已收叠）》
 
 
-### 应用默认深色主题的范文截图
+        - [由（本说明书的）解析程序自动决定之存放地点的版本](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例：简体中文范文配默认浅色主题，1-在宽大尺寸浏览器中的效果（目录已收叠）.png)
 
-- [示例：简体中文范文配默认深色主题，在宽大尺寸浏览器中的效果（目录已收叠）](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例：简体中文范文配默认深色主题，1-在宽大尺寸浏览器中的效果（目录已收叠）.png)
-- [Snapshot: In default dark-colored theme, in a wide window, with toc collapsed](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/example_en-US_default-dark-colored-theme_1-in-a-wide-window_with-toc-collapsed.png)
+        - [存放在 Gitee 中的版本，便于中国大陆地区查阅](https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns/blob/master/%E6%96%87%E6%A1%A3%E9%9B%86/%E6%96%87%E7%AB%A0%E6%8E%92%E7%89%88%E4%B8%8E%E9%85%8D%E8%89%B2%E6%95%88%E6%9E%9C%E7%A4%BA%E4%BE%8B%E9%9B%86/%E4%BB%A5-html-%E6%A0%BC%E5%BC%8F%E6%B8%B2%E6%9F%93%E5%A5%BD%E7%9A%84%E6%96%87%E7%AB%A0%E6%88%90%E5%93%81/%E5%90%84%E6%96%87%E7%AB%A0%E6%9C%80%E7%BB%88%E5%91%88%E7%8E%B0%E6%95%88%E6%9E%9C%E4%B9%8B%E6%88%AA%E5%9B%BE/%E7%A4%BA%E4%BE%8B%EF%BC%9A%E7%AE%80%E4%BD%93%E4%B8%AD%E6%96%87%E8%8C%83%E6%96%87%E9%85%8D%E9%BB%98%E8%AE%A4%E6%B5%85%E8%89%B2%E4%B8%BB%E9%A2%98%EF%BC%8C1-%E5%9C%A8%E5%AE%BD%E5%A4%A7%E5%B0%BA%E5%AF%B8%E6%B5%8F%E8%A7%88%E5%99%A8%E4%B8%AD%E7%9A%84%E6%95%88%E6%9E%9C%EF%BC%88%E7%9B%AE%E5%BD%95%E5%B7%B2%E6%94%B6%E5%8F%A0%EF%BC%89.png)
 
 
-### 范文的所有截图
+    -  《示例：In default **light-colored** theme, in a wide window, with toc collapsed》。
+
+        -   [由（本说明书的）解析程序自动决定之存放地点的版本](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/example_en-US_default-light-colored-theme_1-in-a-wide-window_with-toc-collapsed.png)
+
+        -   [存放在 Gitee 中的版本，便于中国大陆地区查阅](https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns/blob/master/%E6%96%87%E6%A1%A3%E9%9B%86/%E6%96%87%E7%AB%A0%E6%8E%92%E7%89%88%E4%B8%8E%E9%85%8D%E8%89%B2%E6%95%88%E6%9E%9C%E7%A4%BA%E4%BE%8B%E9%9B%86/%E4%BB%A5-html-%E6%A0%BC%E5%BC%8F%E6%B8%B2%E6%9F%93%E5%A5%BD%E7%9A%84%E6%96%87%E7%AB%A0%E6%88%90%E5%93%81/%E5%90%84%E6%96%87%E7%AB%A0%E6%9C%80%E7%BB%88%E5%91%88%E7%8E%B0%E6%95%88%E6%9E%9C%E4%B9%8B%E6%88%AA%E5%9B%BE/example_en-US_default-light-colored-theme_1-in-a-wide-window_with-toc-collapsed.png)
+
+
+1.  应用了**默认深色主题**的范文之截图
+
+    -   《示例：简体中文范文配默认**深色**主题，在宽大尺寸浏览器中的效果（目录已收叠）》
+
+        -   [由（本说明书的）解析程序自动决定之存放地点的版本](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例：简体中文范文配默认深色主题，1-在宽大尺寸浏览器中的效果（目录已收叠）.png)
+
+        -   [存放在 Gitee 中的版本，便于中国大陆地区查阅](https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns/blob/master/%E6%96%87%E6%A1%A3%E9%9B%86/%E6%96%87%E7%AB%A0%E6%8E%92%E7%89%88%E4%B8%8E%E9%85%8D%E8%89%B2%E6%95%88%E6%9E%9C%E7%A4%BA%E4%BE%8B%E9%9B%86/%E4%BB%A5-html-%E6%A0%BC%E5%BC%8F%E6%B8%B2%E6%9F%93%E5%A5%BD%E7%9A%84%E6%96%87%E7%AB%A0%E6%88%90%E5%93%81/%E5%90%84%E6%96%87%E7%AB%A0%E6%9C%80%E7%BB%88%E5%91%88%E7%8E%B0%E6%95%88%E6%9E%9C%E4%B9%8B%E6%88%AA%E5%9B%BE/%E7%A4%BA%E4%BE%8B%EF%BC%9A%E7%AE%80%E4%BD%93%E4%B8%AD%E6%96%87%E8%8C%83%E6%96%87%E9%85%8D%E9%BB%98%E8%AE%A4%E6%B7%B1%E8%89%B2%E4%B8%BB%E9%A2%98%EF%BC%8C1-%E5%9C%A8%E5%AE%BD%E5%A4%A7%E5%B0%BA%E5%AF%B8%E6%B5%8F%E8%A7%88%E5%99%A8%E4%B8%AD%E7%9A%84%E6%95%88%E6%9E%9C%EF%BC%88%E7%9B%AE%E5%BD%95%E5%B7%B2%E6%94%B6%E5%8F%A0%EF%BC%89.png)
+
+    -   《示例：In default **dark-colored** theme, in a wide window, with toc collapsed》。
+
+        -   [由（本说明书的）解析程序自动决定之存放地点的版本](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/example_en-US_default-dark-colored-theme_1-in-a-wide-window_with-toc-collapsed.png)
+
+        -   [存放在 Gitee 中的版本，便于中国大陆地区查阅](https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns/blob/master/%E6%96%87%E6%A1%A3%E9%9B%86/%E6%96%87%E7%AB%A0%E6%8E%92%E7%89%88%E4%B8%8E%E9%85%8D%E8%89%B2%E6%95%88%E6%9E%9C%E7%A4%BA%E4%BE%8B%E9%9B%86/%E4%BB%A5-html-%E6%A0%BC%E5%BC%8F%E6%B8%B2%E6%9F%93%E5%A5%BD%E7%9A%84%E6%96%87%E7%AB%A0%E6%88%90%E5%93%81/%E5%90%84%E6%96%87%E7%AB%A0%E6%9C%80%E7%BB%88%E5%91%88%E7%8E%B0%E6%95%88%E6%9E%9C%E4%B9%8B%E6%88%AA%E5%9B%BE/example_en-US_default-dark-colored-theme_1-in-a-wide-window_with-toc-collapsed.png)
+
+
+#### 范文的所有截图
 
 两篇范文之截图不止于上文中提及的四幅。更多图例，见：
 
 - 《[应用效果示例（汉语版）](./文档集/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
-- 《[Application Examples (en-US)](./文档集/说明书/en-US/application-examples.md)》
+- 《[应用效果示例（英语版）](./文档集/说明书/en-US/application-examples.md)》
 
-另附《[示范文章之截图之制作指南](./文档集/说明书/汉语/示范文章之截图之制作指南.md)》
+#### 范文截图制作指南
 
+另，日常制作网页截图是很简单的事情，但本工具之范文篇幅巨大，为其截图确须一定经验和技巧。见《[示范文章之截图之制作指南](./文档集/说明书/汉语/示范文章之截图之制作指南.md)》。
 
 
 
-## 源代码仓库
 
-| <span style="display:inline-block;width:180px;">提供仓库服务之组织</span> | <span style="display:inline-block;width:150px;">仓库组织之国别</span> | 仓库地址 |
-| ------------- | :----------: | ------- |
-| 码云           | 中华人民共和国 | [https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns](https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns) |
-| 阿里云之代码仓库 | 中华人民共和国 | [https://code.aliyun.com/wulechuan/wulechuan-themes-for-htmls-via-markdowns](https://code.aliyun.com/wulechuan/wulechuan-themes-for-htmls-via-markdowns) |
-| GitHub         | 美           | [https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns](https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns) |
 
+## 使用说明
 
+### 使用须知
 
-## 使用说明
+本工具提供一组层叠样式表（CSS）文件，及配套的 JavaScript 文件（目前仅一个这样的 JavaScript 文件）。它们可用于装点 HTML 文章之样貌，也为文章提供额外的交互行为。应该指出，被装点的文章可以是任何人以任何方式创建的 HTML 文件，但常见的情形往往是这些 HTML 文件系从 MarkDown 文件转换而得。**但重点在于本工具提供的主体内容仅限层叠样式表文件。**
 
-- 本工具仅提供一组层叠样式表（CSS）文件，及配套的 JavaScript 文件（目前仅一个这样的 JavaScript 文件）。不难理解，本工具**并非**用于直接将 Markdown 文件转换为对应的 HTML 文件。本工具假定诸君另有方法，将 Markdown 内容转换成 HTML 内容，仅仅是希望借助本工具提供之 CSS 对 HTML 做进一步的排版美化。于此种情形，用法再简单不过——**自行取用**。
+换言之，本工具**并不能**将 Markdown 文件转换为对应的 HTML 文件。本工具假定诸君各自另有办法将 Markdown 内容转换成 HTML 内容，诸君采用本工具仅仅是希望取其中的 CSS 对诸君的 HTML 做进一步的排版美化。于此种情形，用法再简单不过——**自行取用那些 CSS 文件**即可。
 
 
-    所谓自行取用，即是说诸君在本项目之发布文件夹中自行找到中意之 CSS 文件（及配套 JavaScript 文件），采用之。且于单一 HTML 文件，在本工具提供之所有 CSS 文件取用其任一足矣，不必取用多者。
+所谓自行取用，即是说诸君在本项目之发布文件夹中自行找到中意之 CSS 文件（及配套 JavaScript 文件），采用之。且于单一 HTML 文件，在本工具提供之所有 CSS 文件取用其任一足矣，不必取用多者。
 
-    又，取用本工具提供之 CSS 、 JavaScript 文件之内容时，若每每人为复制、粘贴，未免麻烦，且无从实现批量运用、自动化运用。在面对批量运用或自动化运用之要求时，开发人员当然希望能编写程序调集所需资源加以运用。巧了，本工具确实提供了专门的 JavaScript 编程接口，以 **JavaScript 字符串** 之形式提供各 CSS 、 JavaScript 文件之内容。
+又，取用本工具提供之 CSS 、 JavaScript 文件之内容时，若每每人为复制、粘贴，未免麻烦。尤其是在面对批量运用或自动化运用之要求时，开发人员当然希望能编写程序调集所需资源加以运用。刚巧本工具确实提供了专门的 JavaScript 编程接口，以 **JavaScript 文本（string）** 之形式提供各 CSS 、 JavaScript 文件之内容。见下文《[以程序化之方式取用本工具提供之内容](#以程序化之方式取用本工具提供之内容)》。
 
 
-    > 诸君当然可以自行直接取用本工具中之 CSS 文件，或自行调用本工具之 JavaScript 接口。由此二种途径均可以在你构建 HTML 内容时，利用我的这些 CSS 来美化 HTML 内容。然此二种做法均并非易如反掌，更不能一蹴而就。即，要么须费些功夫，要么须专门学习并积累技术经验。
-    >
-    > 如若诸君之初衷是要将手头的一些 Markdown 文件转换成 HTML 文件，临用之际单单一个 CSS 文件显然不解诸君燃眉之急。诸君首先需要的是一款可以进行文件格式转换之工具，而后才考虑如何将本工具提供之 CSS 嵌入 HTML 之中，可是？如此，则诸君面临新的问题，即要么无暇自行搭建工具链来将 Markdown 转换成 HTML，要么干脆不知所措。于此种情形，鄙人毛遂自荐，愿助诸君一臂之力！鄙人另行自创有三个 NPM 包，专用于轻松、快速地从 Markdown 内容构建对应之 HTML 内容。且三者均默认采用本工具发布之 CSS 之内容（和配套 JavaScript 内容）。我在[本说明书之尾部](#相关推广)亦对此三款软件包做了推广。阁下无需另起炉灶了！唯愿三者之任一能对诸君有所裨益！
+> 不过，不论是手工直接取用本工具中之 CSS 文件，还是调用本工具之 JavaScript 接口取用这些 CSS 文件，都没有解决一部分读者的困难：你们的初衷是要将手头的一些 Markdown 文件转换成 HTML 文件，而采用我提供的这些 CSS 只是锦上添花式的要求。临用之际，单单一个 CSS 文件显然不解燃眉之急。
+>
+> 此种情形下，诸君首先需要的是一款可以进行文件格式转换之工具，而后才考虑如何将本工具提供之 CSS 嵌入 HTML 之中。
+>
+> 那么新的问题来了，我能不能**顺便**推荐几款能将 MarkDown 文件转换至 HTML 文件的工具呢？当然！鄙人毛遂自荐，愿助诸君一臂之力！鄙人另行自创有三个工具，专用于轻松、快速地从 Markdown 内容构建对应之 HTML 内容。且三者均默认采用本工具发布之 CSS 之内容（及配套 JavaScript 内容）。我在[本说明书之尾部](#相关工具之推广)亦对此三款软件包做了推广。诸君无需另起炉灶了！唯愿三者之任一能对君有所裨益！
 
 
-- 如果阁下取用本工具中之 CSS 主题文件另有意图，即与将 Markdown 转换至 HTML 之事毫无干系，那么或许更应该了解如何编写程序调集所需的由本工具提供之 CSS 资源加以运用。见下文《[以程序化之方式取用本工具提供之内容](#以程序化之方式取用本工具提供之内容)》。
+又，如果阁下取用本工具中之 CSS 主题文件另有意图，即与将 Markdown 转换至 HTML 之事毫无干系，那么或许更应该了解如何编写程序调集所需的由本工具提供之 CSS 资源加以运用。见下文《[以程序化之方式取用本工具提供之内容](#以程序化之方式取用本工具提供之内容)》。
 
 
-### 在何处手工取用本工具所生成的文件
+### 手工取用本工具的文件
 
 #### 取用 CSS 文件
 
-请在 `./源代码/发布的源代码/文章排版与配色方案集/层叠样式表` 文件夹下自行获取所需文件。
+请在 `./源代码/发布的源代码/文章排版与配色方案集/层叠样式表` 文件夹下自行获取所需的样式表文件。
 
 #### 取用 Javascript 文件
 
-请在 `./源代码/发布的源代码/文章排版与配色方案集/javascript` 文件夹下自行获取所需文件。
+请在 `./源代码/发布的源代码/文章排版与配色方案集/javascript` 文件夹下自行获取所需的 JavaScript 文件。
 
 
 ### 以程序化之方式取用本工具提供之内容
@@ -127,11 +191,13 @@
 
 在面对批量运用或自动化运用之要求时，开发人员当然希望能编写程序调集所需资源加以运用。本工具确实提供了专门的 JavaScript 编程接口，以 JavaScript 字符串数据的形式提供各 CSS 、 JavaScript 文件之内容。
 
-> 本工具还额外提供了编程接口配套的 TypeScript 类型定义（ `index.d.ts` ）。
+> 本工具还额外提供了编程接口配套的 TypeScript 类型定义：\
+> `源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/index.d.ts`
 
-以程序化之方式调用本工具之方法见下例。
+#### 以程序化之方式取用本工具提供之内容之示范代码
 
-> 下例中代码之主体节选自本项目的<br>《`测试集/用于测试本项目之-javascript-接口的测试代码集.js`》。
+> 下例中代码之主体节选自本项目的\
+> 《`测试集/用于测试本项目之-javascript-接口的测试代码集.js`》。
 
 ```js
 const {
@@ -224,7 +290,7 @@ const 这还是目前唯一的Javascript文件之内容全文 = 获取某一已
 ```
 
 
-#### 所谓“文件简易描述项”
+#### 本工具特有的所谓“文件简易描述项”
 
 其 TypeScript 类型定义如下：
 
@@ -234,7 +300,7 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_文件简易
     文件之相对路径: string;
     文件之绝对路径: string;
     文件内容全文: string;
-    
+
     // 以下为陈旧的采用外国字命名之诸接口。
 
     fileName: string;
@@ -244,22 +310,26 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_文件简易
 };
 ```
 
-#### 获取本工具发布之各排版与配色方案公用的、且目前唯一的 JavaScript 文件
+#### 获取本工具发布之各排版与配色方案公用的（且目前唯一的） JavaScript 文件
 
-**须知本工具提供两类用途不同之 JavaScript 。** 
+首先，**须知本工具提供两类用途不同之 JavaScript 。**
 
-1. 一类是用于注入 HTML 文章以控制 HTML 文章之【纲要】的。
-2. 另一类是本工具提供的程序化接口，它并不直接作用于你的任何 HTML，而仅仅是对外提供本 NPM 包之 CSS 以及第一类 JavaScript 。
+1.  一类是用于注入 HTML 文章以控制 HTML 文章之【纲要】的。
+1.  另一类是本工具提供的程序化接口，它并不直接作用于你的任何 HTML，而仅仅是对外提供本 NPM 包之 CSS 以及第一类 JavaScript 。
 
-为方便指代，不妨称第一类 JavaScript 为所谓“**文章行为之 js** ”，而称第二类 JavaScript 为所谓“**本工具接口之 js** ”，简称“**接口 js** ”。
+为方便指代，不妨：
 
-又，获取本工具发布之各色【文章排版与配色方案】公用的、且目前唯一的“文章行为之 js”时，**允许对该文件之内容进行些许临时定制**。故而，最终获得的内容字符串有异于本工具存储的原始版本。
+1.  称第一类 JavaScript 为所谓“**文章行为之 js** ”，简称“**文章 js**”。目前恰好仅有一个这样的 js 文件。它为本工具发布之各色【文章排版与配色方案】所公用。
+1.  而称第二类 JavaScript 为所谓“**本工具接口之 js** ”，简称“**接口 js** ”。
 
-简而言之，你调用本工具的“接口 js ”中的某接口函数时，可以在接口函数某一项参数传入【配置项集】，以对“文章行为之 js ”之内容做些许定制。
+又，借助“**接口 js**”获取“**文章 js**”之内容时，“接口 js”还**允许对“文章 js”之内容进行些许临时定制**。故而，最终获得的内容字符串有异于本工具存储的原始版本。换言之，你调用本工具的“**接口 js**”中的某接口函数时，可在接口函数的某一项参数传入【配置项集】，以对 “**文章 js**”之内容做些许改变。
 
 > 有两个不同的接口函数各自可以接受该配置项集，但形参位置不同。
-> 1. 一个函数是 `总接口.获取某一已发布之文件之完整内容字符串` ，它在第 3 形参接受上述配置项集，
-> 2. 另一个函数是 `总接口.获取本项目官方选定之所谓默认Javascript之完整内容字符串` ，它在第 2 形参接受上述配置项集。
+> 1.  第一个函数是\
+> `总接口.获取某一已发布之文件之完整内容字符串` ，它在**第 3 形参**接受上述【配置项集】。
+>
+> 1.  第二个函数是\
+> `总接口.获取本项目官方选定之所谓默认Javascript之完整内容字符串` ，它在**第 2 形参**接受上述【配置项集】。
 
 上述【配置项集】之 TypeScript 类型定义如下：
 
@@ -271,13 +341,13 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_拾取默认Ja
      */
 
     为求文章纲要列表简洁明了故意仅显示两层条目以至于较深层级条目形同作废?: boolean;
-    浏览器打开HTML文章最初之时文章纲要列表中凡层级深于该值之条目均应收叠?: boolean;
+    浏览器打开HTML文章最初之时文章纲要列表中凡层级深于该值之条目均应收叠?: number;
     浏览器打开HTML文章最初之时若浏览器窗口足够宽大则直接展开文章纲要列表之面板?: boolean;
-    
+
     // 以下为陈旧的采用外国字命名之诸接口。
 
     shouldShowOnlyTwoLevelsOfTOCItemsAtMost?: boolean;
-    atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan?: boolean;
+    atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan?: number;
     atBeginingShouldExpandTOCWhenWindowIsWideEnough?: boolean;
 };
 ```
@@ -290,13 +360,13 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_拾取默认Ja
 -----
 
 
-## 相关推广
+## 相关工具之推广
 
-鄙人另有一款 NPM 包，名为“[@wulechuan/generate-html-via-markdown](https://www.npmjs.com/package/@wulechuan/generate-html-via-markdown)”。为便于指称，暂将其叫做“**甲**”。调用甲之接口，可将传入甲的 Markdown 字符串转换成 HTML 字符串。此时，甲默认会采用本工具提供的 CSS 文件来装饰甲自身产生的 HTML 之内容。
+鄙人另有一款 NPM 包，名为“[@wulechuan/generate-html-via-markdown](https://www.npmjs.com/package/@wulechuan/generate-html-via-markdown)”。为便于指称，不妨暂称“**甲**”。调用甲之接口，可将传入该接口的 Markdown 字符串转换成 HTML 字符串。此时，甲默认会采用本工具提供的 CSS 文件来装饰甲自身产生的 HTML 之内容。
 
 鄙人还有一款 NPM 包，名为“[@wulechuan/gulp-markdown-to-html](https://www.npmjs.com/package/@wulechuan/gulp-markdown-to-html)”，且作“**乙**”。乙恰如甲的一个包覆层，使得甲中之功能特性可以适配 [Gulpjs](https://gulpjs.com) 任务流水线。
 
-鄙人还有一款 NPM 包，名为“[@wulechuan/markdown-to-html-via-cli](https://www.npmjs.com/package/@wulechuan/markdown-to-html-via-cli)”，且作“**丙**”。丙恰如甲的另一个包覆层，使得任何人在安装丙后（**无须另行安装甲**），即可在命令行环境轻松使用甲之功能，实现从文件到文件的**批量转换**。且丙设计有多种命令行参数，以便定制输出之 HTML 之具体细节。且诸君毋需担心命令行参数记忆负担过重之问题，仅需“`--help`”一招，即可解君之忧。
+鄙人还有一款 NPM 包，名为“[@wulechuan/markdown-to-html-via-cli](https://www.npmjs.com/package/@wulechuan/markdown-to-html-via-cli)”，且作“**丙**”。丙恰如甲的另一个包覆层，使得任何人在安装丙后（**无须另行安装甲**），即可在命令行环境轻松使用甲之功能，实现从文件到文件的**批量转换**。且丙设计有多种命令行参数，以便定制输出之 HTML 之具体细节。诸君毋需担心命令行参数记忆负担过重之问题，仅需“`--help`”一招，即可解君之忧。
 
 
 
@@ -304,13 +374,7 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_拾取默认Ja
 
 ## 未来计划
 
-- 避免使用 `rem` 作为层叠样式表的长度单位，而改用 `em` ，特别是要避免输出的层叠样式表对 `rem` 进行配置。理由是倘若本工具产生之层叠样式表如果系用作美化某复杂 Web 应用之局部之文章，本工具提供的层叠样式表不应该粗暴篡改 `rem` 之取值。
-
-    > 该项工作已经在进行，全靠业余之投入，截止 2021-03-13 仍未完成。
-
-- 考虑引入更多的 Stylus 变量，来控制主题。但我有疑虑。过分工程化可能反而导致源代码难以理解，不便定制。
-
-- 覆盖 Typora 中“纲要列表”的原有样式？
+暂无。
 
 
 ## 版本 6 及更旧版本之源代码业已删除
@@ -319,6 +383,12 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_拾取默认Ja
 
 1.  旧版代码不复存在。
 2.  当前的范文截图常常与代码所能产出之真正面貌有所差异，因为范文更新进度多半时候落后于代码，也落后于 NPM 版本发布。
+
+    > 最末发布的截图系针对本工具之 `v7.6.0` 版，各图均制作于 2022 年 5 月 1 日。
+    >
+    > 但若再有新图发布替换旧图，亦可因为本人遗漏对此文之修订而令上述版本、发布日期均不实。
+
+
 3.  未来是否因为代码仓库累计尺寸巨大而再次清空代码仓库从头提交代码，亦未可知。
 
 
@@ -326,7 +396,7 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_拾取默认Ja
 
 WTFPL
 
-> 注意：
+> ### 注意
 >
 > 我未研究过许可证的约束。因此姑且声明为 WTFPL 类型。但实际上该许可证类型可能与我采用的开源模块有冲突。
 

package/package.json

@@ -2,8 +2,8 @@
   "name": "@wulechuan/css-stylus-markdown-themes",
   "author": "吴乐川 <wulechuan@live.com>",
   "license": "WTFPL",
-  "version": "7.5.0",
-  "description": "此为吴乐川的《HTML 文章排版与配色之方案集与相关制作工具》。本工具可用于构建一组层叠样式表（即 CSS ）文件，本工具亦提供了一组现成的层叠样式表文件。凡这些样式表，均可用于美化采用超文本标记语言（即 HTML ）格式存储的文章。且不必同时取用多个样式表文件，仅取其一足矣。",
+  "version": "7.6.1",
+  "description": "此为吴乐川的《HTML 文章排版与配色之方案集与相关制作工具》。本工具可用于构建一组层叠样式表（即 CSS ）文件。本工具亦提供了一组现成的层叠样式表文件。凡这些样式表，均可用于美化超文本标记语言（即 HTML）格式的文章。于单一文章，不必同时取用多个样式表文件，仅取其一足矣。",
   "directories": {
     "source": "源代码/原始的源代码",
     "dist": "源代码/发布的源代码",
@@ -12,6 +12,7 @@
   },
   "main": "源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/index.js",
   "types": "源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/index.d.ts",
+  "type": "commonjs",
   "scripts": {
     "eslint": "eslint    ./.eslintrc.js    ./gulpfile.esm.js/**/*.js    ./文档集/文章排版与配色效果示例集/*.js    ./测试集/*.js    ./源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/*.js    ./源代码/原始的源代码/用于设计文章排版与配色方案的代码/js/**/*.js    ./本项目之全局配置项集.js",
     "open-firefox-for-snapshots": "start    firefox    ./测试集/产生的临时文件/示例性-html-文件集（均嵌有半自动化截图辅助逻辑）/example.en-us.default-light-colored-theme.html    ./测试集/产生的临时文件/示例性-html-文件集（均嵌有半自动化截图辅助逻辑）/example.en-us.default-dark-colored-theme.html    ./测试集/产生的临时文件/示例性-html-文件集（均嵌有半自动化截图辅助逻辑）/example.zh-hans-cn.default-light-colored-theme.html    ./测试集/产生的临时文件/示例性-html-文件集（均嵌有半自动化截图辅助逻辑）/example.zh-hans-cn.default-dark-colored-theme.html",
@@ -31,9 +32,40 @@
     "test": "npm     run  eslint        &&        npm  run  _test-all-without-linting-without-browser    &&    npm  run  open-firefox-for-snapshots    &&    npm  run  open-dev-htmls",
     "build": "npm    run  eslint        &&        npm  run  _build                                       &&    npm  run  update-example-htmls",
     "build-2": "npm  run  eslint        &&        npm  run  _build-2                                     &&    npm  run  update-example-htmls-2",
-    "每当制作集得之版本之前": "npm  i    &&    npm  test",
+    "发布新图片之前对开发者做出提醒": "node  ./文档集/文章排版与配色效果示例集/供-nodejs-调用--发布新图片前的必要步骤.js    &    code   ./文档集/文章排版与配色效果示例集/发布新图片前的必要步骤.md",
+    "每当制作集得之版本之前": "npm  i    &&    npm  test    &&    npm  run  发布新图片之前对开发者做出提醒",
     "prepublishOnly": "npm       i    &&    npm  test"
   },
+  "dependencies": {
+    "globby": "^11.1.0"
+  },
+  "devDependencies": {
+    "@wulechuan/cli-scripts--git-push": "^2.0.2",
+    "@wulechuan/generate-html-via-markdown": "^3.2.1",
+    "@wulechuan/gulp-classical-task-cycle": "^0.3.0",
+    "chalk": "^4.1.2",
+    "cssnano": "^5.1.7",
+    "del": "^6.0.0",
+    "eslint": "^8.14.0",
+    "esm": "^3.2.25",
+    "fs-extra": "^10.1.0",
+    "gulp": "^4.0.2",
+    "gulp-concat": "^2.6.1",
+    "gulp-pipe": "^1.0.4",
+    "gulp-postcss": "^9.0.1",
+    "gulp-rename": "^2.0.0",
+    "gulp-stylus": "^2.7.1",
+    "gulp-terser": "^2.1.0",
+    "postcss": "^8.4.13"
+  },
+  "homepage": "https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git"
+  },
+  "bugs": {
+    "url": "https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns/issues"
+  },
   "keywords": [
     "markdown",
     "html",
@@ -64,35 +96,5 @@
     "stylus",
     "cascading-style-sheet",
     "cascading-style-sheets"
-  ],
-  "homepage": "https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns#readme",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git"
-  },
-  "bugs": {
-    "url": "https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns/issues"
-  },
-  "dependencies": {
-    "globby": "^11.1.0"
-  },
-  "devDependencies": {
-    "@wulechuan/cli-scripts--git-push": "^2.0.1",
-    "@wulechuan/generate-html-via-markdown": "^3.1.1",
-    "@wulechuan/gulp-classical-task-cycle": "^0.3.0",
-    "chalk": "^4.1.2",
-    "cssnano": "^5.1.7",
-    "del": "^6.0.0",
-    "eslint": "^8.14.0",
-    "esm": "^3.2.25",
-    "fs-extra": "^10.1.0",
-    "gulp": "^4.0.2",
-    "gulp-concat": "^2.6.1",
-    "gulp-pipe": "^1.0.4",
-    "gulp-postcss": "^9.0.1",
-    "gulp-rename": "^2.0.0",
-    "gulp-stylus": "^2.7.1",
-    "gulp-terser": "^2.1.0",
-    "postcss": "^8.4.12"
-  }
+  ]
 }

package//346/226/207/346/241/243/351/233/206//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/225/210/346/236/234/347/244/272/344/276/213/351/233/206//345/216/237/345/247/213/347/232/204-markdown-/346/240/274/345/274/217/347/232/204/346/226/207/347/253/240/theming-example-article.zh-hans-CN.md

@@ -1,4 +1,4 @@
-# 吴乐川的文章默认样式的示例
+# 吴乐川的文章默认样式的示例<br><small>——样式均采用 stylus 语言编写</small>
 
 <p class="document-author">作者：吴乐川</p>
 
@@ -64,12 +64,49 @@
 
 再来看看行文中的【代码词汇】、【专有名词】和【术语】：例如`grep`、`孙行者`和`中央处理单元`。又如`querySelector`和`querySelectorAll`早已取代了老式的`getElementsById`等函数。术语框中的多个连续空格也应得到保留，例如`这后面有四个空格    这前面有四个空格`。
 
-术语与超链接还可组合为一体。新中国的建立和成长离不开一群功勋卓著的科学家们。例如伟大的、富有爱国主义精神和民族自信的[`钱学森`](https://baike.baidu.com/item/%E9%92%B1%E5%AD%A6%E6%A3%AE/26105)，他是**中国科学院资深院士**、**中国工程院资深院士**。
+术语与超链接还可组合为一体。甚至与着重、斜体等效果进行组合。新中国的建立和成长离不开一群功勋卓著的科学家们。例如伟大的、富有爱国主义精神和民族自信的[`钱学森`](https://baike.baidu.com/item/%E9%92%B1%E5%AD%A6%E6%A3%AE/26105)，**他是 `中国科学院资深院士`、 `中国工程院资深院士`。** *他提出的`钱学森弹道`至今（2022年4月）仍是 __无法拦截的__* ！如今，我们在科技领域面临的两大钳制是 _**粮食`育种`技术**_ 和 **_高性能`光刻机`制造技术_** 。
+
 
 计算机键盘快捷键，其视觉样式如是：<kbd>Ctrl</kbd>+<kbd>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</kbd>；又例：如今，<kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>s</kbd>这一组合键早已广泛用于各种现代计算机软件中，代表（将工作内容或文件）`另存为`（壹文件）之功能。
 
-还有些内容会故意“杠掉”，即被中划线划去，表示此内容不正确，不应采纳，应作废。例如：~~地球是平的~~。
+还有些内容会故意“杠掉”，即被中划线划去，表示此内容不正确，不应采纳，应作废。例如：~~地球是平的~~。术语或专有名词也可以标记为废弃，例：非必要不用舶来词。不应称 ~~`车厘子`~~ ，而应称 `进口樱桃` 。不应称 ~~`芝士`~~ 、 ~~`起司`~~ ，而应称 `奶酪` 。还有两个作废的超链接： ~~[`SOFTIMAGE.com`](http://softimage.com/)~~ 和 ~~[`假设已经删除的章节的文内链接`](#)~~ 。
+
+#### 复杂的样式组合
+
+
+再看几个“近乎终极”的组合效果——具有着重斜体强调的带有超链接的术语。为什么不止一个？因为 HTML 标签的嵌套组合是很灵活的，偏偏 MarkDown 的语法又允许制造出这几种组合。如下。
+
+-   着重符号（即星号与下划线）包裹在方括号外的效果：我们中国有 **_了不起的民营企业[`华为`](https://consumer.huawei.com/cn/)公司_** 或我们中国有 _**了不起的民营企业[`福耀玻璃`](https://www.fuyaogroup.com/)公司**_。
+
+    上例的 MarkDown 源码：
+
+    ```md
+    **_了不起的民营企业[`华为`](https://consumer.huawei.com/cn/)公司_**
+    ```
+
+    ```md
+    _**了不起的民营企业[`福耀玻璃`](https://www.fuyaogroup.com/)公司**_
+    ```
+
+-   着重符号（即星号与下划线）在方括号内：我们中国有 [**_了不起的民营企业`华为`公司_**](https://consumer.huawei.com/cn/) 或我们中国有 [_**了不起的民营企业`福耀玻璃`公司**_](https://www.fuyaogroup.com/)。
+
+    上例的 MarkDown 源码：
+
+    ```md
+    [**_了不起的民营企业_`华为`公司_**](https://consumer.huawei.com/cn/)
+    ```
+
+    ```md
+    [_**_了不起的民营企业`福耀玻璃`公司**_](https://www.fuyaogroup.com/)
+    ```
+
+不难看出，我的策略是任凭它如何组合，我总是令它们的视觉效果一致。因为我认为尽管文章作者处于任何原因采用了不一致的书写方式，但他意图达到的目的是相同的。
+
+你以为这就完了？非也！倘若再加上删除线呢？那就更复杂了！例如：每每危难时刻，不论哪一个国家或地区，总有昧着良心的人在 ~~[**_`发国难财`_**](https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820)~~ 、 [~~**_`发国难财`_**~~](https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820) 、 [**~~_`发国难财`_~~**](https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820) 或 [**_~~`发国难财`~~_**](https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820) ，以及 ~~**_[`发国难财`](https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820)_**~~ 、 **~~_[`发国难财`](https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820)_~~**  或 **_~~[`发国难财`](https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820)~~_** 。这些人终将受到历史的审判！
+
+去掉超链接再试试：中国南宋时期有一个十恶不赦的奸佞宰相，名唤 ~~__*`秦桧`*__~~ 、 __~~*`秦桧`*~~__ 、 __*~~`秦桧`~~*__ 或 *__~~`秦桧`~~__* ，他陷害了*爱国将领 [`岳飞`](https://baike.baidu.com/item/%E5%B2%B3%E9%A3%9E/127844)* 。
 
+> 注：排列组合的可能性太多，示例不一而足。
 
 #### 多级列表
 
@@ -112,7 +149,7 @@
         -   壬：巡海夜叉
         -   癸：长生云
 
-6.  第 1 级第 6 项
+6.  第 1 级第 6 项。“`81192`，收到请返航。”
 
 
 ### 多级标题（这是 h3）
@@ -302,7 +339,7 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
     > `circumference` [sər&apos;kʌmf(ə)rəns] <i>n.</i> 圆周长
 
 -   <details open>
-    <summary>折叠内容中的代码块1</summary>
+    <summary>在折叠内容块中的代码块1</summary>
 
     ```js
     var age = +prompt('你多大了？');
@@ -313,12 +350,12 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
 
 
 
-#### 叠内容中的代码块
+#### 在折叠内容块中的代码块
 
-下面是在叠内容中的代码块。
+下面是在折叠内容块中的代码块。
 
 <details open>
-<summary>折叠内容中的代码块2</summary>
+<summary>在折叠内容块中的代码块2</summary>
 
 ```js
 console.log(NaN === NaN); // false
@@ -887,7 +924,7 @@ nav li {
 <table>
     <thead>
         <tr>
-            <th style="width: 5em;">甲</th>
+            <th style="width: 7em;">甲</th>
             <th>乙</th>
         </tr>
     </thead>

package//346/226/207/346/241/243/351/233/206//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/225/210/346/236/234/347/244/272/344/276/213/351/233/206//345/217/221/345/270/203/346/226/260/345/233/276/347/211/207/345/211/215/347/232/204/345/277/205/350/246/201/346/255/245/351/252/244.md

@@ -0,0 +1,13 @@
+# 吴乐川的 HTML 文章排版与配色之方案集发布范文的新截图之前的必要步骤
+
+
+<link rel="stylesheet" href="../../源代码/发布的源代码/文章排版与配色方案集/层叠样式表/wulechuan-styles-for-html-via-markdown--vscode.default.min.css">
+
+
+1.  确保图片数目齐全。目前应为 25 张。
+
+2.  采用任何图像处理工具，将图片文件字节数尽量减小。
+
+3.  修订《说明书》中的该小节《[**版本 6 及更旧版本之源代码业已删除**](../../ReadMe.md#版本%206%20及更旧版本之源代码业已删除)》以如实记载新图片的制作和发布日期、对应该工具的版本等信息。
+
+4.  修订《[关于文章排版与配色效果示例集的说明](../%E8%AF%B4%E6%98%8E%E4%B9%A6/%E6%B1%89%E8%AF%AD/%E5%85%B3%E4%BA%8E%E6%96%87%E7%AB%A0%E6%8E%92%E7%89%88%E4%B8%8E%E9%85%8D%E8%89%B2%E6%95%88%E6%9E%9C%E7%A4%BA%E4%BE%8B%E9%9B%86%E7%9A%84%E8%AF%B4%E6%98%8E.md)》以及《[application-examples](../%E8%AF%B4%E6%98%8E%E4%B9%A6/en-US/application-examples.md)》，以如实记载所采用的浏览器品牌。

package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206/javascript/table-of-contents-and-back-to-top-anchor-behaviors.js

@@ -17,9 +17,9 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
     const printDoubleLine = '='.repeat(fullWidth)
 
     const emailAddress = 'wulechuan@live.com'
-    const timeStamp = '北京时间 2021-03-21'
+    const timeStamp = '北京时间 2022-05-01'
 
-    const welcomeZhHansCN = '欢迎使用吴乐川设计的用于控制文章目录之交互的控制器。'
+    const welcomeZhHansCN = '欢迎使用吴乐川设计的用于“控制文章目录之交互”的控制器。'
     const welcomeEn = 'Welcome to wulechuan\'s article TOC controller.'
 
     const words = '中国人——特别是汉族人，理应坚持广泛、规范地使用汉语。凡非必要之情形不说外国话、不用外国字。此乃天经地义！\n然则每当必要，亦不排斥采用外国之语言。不妨博世界之学问，养中国之精神。\n本人亦支持少数民族坚持采用自己民族的传统语言。仍须强调，凡中国人，皆应会用汉语、积极使用汉语，此乃中华各民族之大一统之必由。'
@@ -52,9 +52,9 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
     console.log(
         `\n${
             printDoubleLine
-        }\n\n${
+        }\n\n%c${
             welcomeZhHansCN
-        }\n（ ${
+        }%c\n（ ${
             welcomeEn
         } ）\n\n${
             ' '.repeat(fullWidth - emailAddress.length)
@@ -74,7 +74,22 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
             wordLines.join('\n')
         }\n\n${
             printDoubleLine
-        }\n\n\n`
+        }\n\n\n`,
+
+        [
+            'font-family: sans-serif;',
+            'font-size: 1.25em;',
+            'display: inline-block;',
+            'vertical-align: baseline;',
+            'color: #000;',
+            'text-shadow: 0.5px 0.5px 2px rgba(0, 0, 0, 0.51);',
+            'background-color: #ffe0be;',
+            'border-radius: 3px;',
+            'margin: 0.5em 0;',
+            'padding: 0.5em 1em 0.5em 1.5em;',
+        ].join(''),
+
+        null
     )
 
     const cssClassNameTOCExists                  = 'markdown-article-toc-exists'