document/TranslateProject
2
0
Fork 0
mirror of https://github.com/LCTT/TranslateProject.git synced 2024-12-26 21:30:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #28307 from wxy/20221215.2-⭐️⭐️-Improve-your-documentation-with-JavaScript

Browse Source 
RP:published/20221215.2 ⭐️⭐️ Improve your documentation with JavaScript.md
This commit is contained in:
Xingyu.Wang 2022-12-23 10:11:22 +08:00 committed by GitHub
commit 11e4c251e9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
translated/tech/20221215.2 ⭐️⭐️ Improve your documentation with JavaScript.md → published/20221215.2 ⭐️⭐️ Improve your documentation with JavaScript.md
View File

@ -3,31 +3,36 @@
[#]: author: "Jim Hall https://opensource.com/users/jim-hall"
[#]: collector: "lkxed"
[#]: translator: "duoluoxiaosheng"
[#]: reviewer: " "
[#]: publisher: " "
[#]: url: " "
[#]: reviewer: "wxy"
[#]: publisher: "wxy"
[#]: url: "https://linux.cn/article-15375-1.html"
使用 JavaScript 增强您的文档
使用 JavaScript 增强你的文档
======
开源软件项目通常拥有非常多样化的用户人群。有些用户非常擅长使用该系统，并且只需要很少的文档。对于这些实力派的用户。文档只需要提供必要的提示，并且可以包含更多的技术信息，比如说在 shell 中运行的命令行。有些用户可能只是初学者。这些用户需要更多的帮助来设置系统并学习如何使用它。
![][0]
> 让你的开源项目文档充满活力，从而吸引各种经验水平的用户。
开源软件项目通常拥有非常多样化的用户人群。有些用户非常擅长使用该系统，并且只需要很少的文档。对于这些实力派用户，文档只需要提供必要的提示，并且可以包含更多的技术信息，比如说在 Shell 中运行的命令行。有些用户可能只是初学者。这些用户需要更多的帮助来设置系统并学习如何使用它。
写一个同时适合这两个用户群体的文档是令人生畏的。网站文档需要在 “提供详细的技术信息” 和 “提供更多的概述和指导” 之间寻求一个平衡。这是一个很难找到的平衡。如果你的文档不能同时满足这两个用户人群，那么考虑一下另外一个选择 —— 动态文档。
探索在网页中添加一点 [JavaScript][1] 使用户可以选择自己想看的内容。
### 构建您的内容
### 构建你的内容
你可以把例程添加的你的文档中需要同时满足 <ruby>专家<rt>expert</rt></ruby> 和 <ruby>初学者<rt>novice</rt></ruby> 的地方。在这个例程中，你可以使用一个叫做 AwesmeProject 的虚构的音乐播放器。
你可以把例程添加的你的文档中需要同时满足 <ruby>专家<rt>expert</rt></ruby> 和 <ruby>初学者<rt>novice</rt></ruby> 的地方。在这个例程中，我们可以使用一个虚构的名为 AwesmeProject 的音乐播放器。
你可以用 HTML 编写一个简短的安装文档，通过 HTML 的 <ruby>类<rt>class</rt></ruby> 功能同时为专家和初学者提供操作指南。例如，你可以用下面的代码来为专家定义一个段落：
你可以用 HTML 编写一个简短的安装文档，通过 HTML 的 <ruby>类<rt>class</rt></ruby> 功能同时为专家和初学者提供操作指南。
例如，你可以用下面的代码来为专家定义一个段落：
```
<p class="expert reader">
```
这就同时指派了专家类 和读者类。 你可以用下面的代码来为初学者创建一个相同的段落。
这同时指派了 “专家类” 和 “读者类”。你可以用下面的代码来为初学者创建一个相同的段落。
```
<p class="novice reader">
@ -70,7 +75,7 @@ most Linux distributions. Check your graphical package manager and search for Aw
![Image of html in black text.][2]
我们可在文档中添加一些简单的样式来为 <ruby>读者<rt>reader</rt></ruby>，<ruby>专家<rt>expert</rt></ruby> 或者 <ruby>初学者<rt>novice</rt></ruby> 突出任何元素。为了使不同的文本更容易区分，让我们把读者类的背景颜色设置成米白色，专家类的字体颜色设置为深红色，初学者的字体颜色则设置为深蓝色。
我们可在文档中添加一些简单的样式来为 <ruby>读者<rt>reader</rt></ruby>、<ruby>专家<rt>expert</rt></ruby> 或者 <ruby>初学者<rt>novice</rt></ruby> 突出任何元素。为了使不同的文本更容易区分，让我们把读者类的背景颜色设置成米白色，专家类的字体颜色设置为深红色，初学者的字体颜色则设置为深蓝色。
```
<!DOCTYPE html>
@ -104,7 +109,7 @@ color: darkblue;
<h1>How to install the software</h1>
```
当你在浏览器中查看这个网页时，这些样式有助于这两个段落的突出。安装指导的所有段落都有一个米白色背景，因为他们都有 <ruby>读者<rt>reader</rt></ruby> 这个类。第一个段落的字体是深红色的，这是由 <ruby>专家<rt>expert</rt></ruby> 这个类定义的。第二个段落的字体是深蓝色的，则是由 <ruby>初学者<rt>novice</rt></ruby> 这个类定义的。
当你在浏览器中查看这个网页时，这些样式有助于突出这两个段落。安装指导的所有段落都有一个米白色背景，因为他们都有 <ruby>读者<rt>reader</rt></ruby> 这个类。第一个段落的字体是深红色的，这是由 <ruby>专家<rt>expert</rt></ruby> 这个类定义的。第二个段落的字体是深蓝色的，则是由 <ruby>初学者<rt>novice</rt></ruby> 这个类定义的。
![Image of html in red and black text.][3]
@ -223,7 +228,7 @@ via: https://opensource.com/article/22/12/dynamic-documentation-javascript
作者：[Jim Hall][a]
选题：[lkxed][b]
译者：[duoluoxiaosheng](https://github.com/duoluoxiaosehng)
校对：[校对者ID](https://github.com/校对者ID)
校对：[wxy](https://github.com/wxy)
本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译，[Linux中国](https://linux.cn/) 荣誉推出
@ -235,3 +240,4 @@ via: https://opensource.com/article/22/12/dynamic-documentation-javascript
[4]: https://opensource.com/sites/default/files/2022-12/publishone.novicexpert.png
[5]: https://opensource.com/sites/default/files/2022-12/publishone.blue_.png
[6]: https://opensource.com/sites/default/files/2022-12/publishone.red_.png
[0]: https://img.linux.net.cn/data/attachment/album/202212/23/100615quu385qf83bu3p35.jpg