-你可以用 `grid-column` 属性定义网格项开始和结束的位置，进而控制每个网格项占用的列数。
+要设置一个网格项占据几列，你可以使用 `grid-column` 属性加上网格线条的编号来定义网格项开始和结束的位置。
示例如下：
diff --git a/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-25-5-clock.md b/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-25-5-clock.md
index 0a332ee2b3..2c66d0e2c7 100644
--- a/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-25-5-clock.md
+++ b/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-25-5-clock.md
@@ -1,6 +1,6 @@
---
id: bd7158d8c442eddfaeb5bd0f
-title: Build a 25 + 5 Clock
+title: 构建一个番茄时钟
challengeType: 3
forumTopicId: 301373
dashedName: build-a-25--5-clock
@@ -8,71 +8,71 @@ dashedName: build-a-25--5-clock
# --description--
-**Objective:** Build a [CodePen.io](https://codepen.io) app that is functionally similar to this: .
+**目标：** 在 [CodePen.io](https://codepen.io) 上实现一个功能类似 的 App。
-Fulfill the below [user stories](https://en.wikipedia.org/wiki/User_story) and get all of the tests to pass. Give it your own personal style.
+在满足以下[需求](https://en.wikipedia.org/wiki/User_story)并能通过所有测试的前提下， 可以根据自己的喜好来美化 app。
-You can use any mix of HTML, JavaScript, CSS, Bootstrap, SASS, React, Redux, and jQuery to complete this project. You should use a frontend framework (like React for example) because this section is about learning frontend frameworks. Additional technologies not listed above are not recommended and using them is at your own risk. We are looking at supporting other frontend frameworks like Angular and Vue, but they are not currently supported. We will accept and try to fix all issue reports that use the suggested technology stack for this project. Happy coding!
+可以使用 HTML、JavaScript、CSS、Bootstrap、SASS、React、Redux、jQuery 来完成这个挑战。 但鉴于这个章节的学习内容与前端框架相关，推荐使用一款前端框架（比如 React）来完成这个挑战。 不推荐使用前面没有提到的技术，否则风险自负。 我们有计划新增其他前端框架课程，例如 Angular 和 Vue，不过目前还没有这些内容。 如果使用建议的技术栈完成这个项目，我们会接受并尝试修复相关的问题反馈。 编码愉快！
-**User Story #1:** I can see an element with `id="break-label"` that contains a string (e.g. "Break Length").
+**需求 1：** 应该能看到一个具有`id="break-label"`属性的元素，这个元素的内容应该是一个字符串（例如："Break Length"）。
-**User Story #2:** I can see an element with `id="session-label"` that contains a string (e.g. "Session Length").
+**需求 2：** 应该能看到一个具有`id="session-label"`属性的元素，这个元素的内容应该是一个字符串（例如："Session Length"）。
-**User Story #3:** I can see two clickable elements with corresponding IDs: `id="break-decrement"` and `id="session-decrement"`.
+**需求 3：** 应该能看到两个可以点击的元素，他们分别具有如下 id：`id="break-decrement"` 和 `id="session-decrement"`。
-**User Story #4:** I can see two clickable elements with corresponding IDs: `id="break-increment"` and `id="session-increment"`.
+**需求 4：** 应该能看到两个可以点击的元素，它们分别具有如下 id：`id="break-increment"` 和 `id="session-increment"`。
-**User Story #5:** I can see an element with a corresponding `id="break-length"`, which by default (on load) displays a value of 5.
+**需求 5：** 应该能看到一个具有 `id="break-length"` 属性的元素，这个元素默认展示数值应该为 5（加载后）。
-**User Story #6:** I can see an element with a corresponding `id="session-length"`, which by default displays a value of 25.
+**需求 6：** 应该能看到一个具有 `id="session-length"` 属性的元素，这个元素默认展示数值应该为 25（加载后）。
-**User Story #7:** I can see an element with a corresponding `id="timer-label"`, that contains a string indicating a session is initialized (e.g. "Session").
+**需求 7：** 应该能看到一个具有 `id="timer-label"` 属性的元素，这个元素包含一个表示当前状态的字符串（例如："Session"）。
-**User Story #8:** I can see an element with corresponding `id="time-left"`. NOTE: Paused or running, the value in this field should always be displayed in `mm:ss` format (i.e. 25:00).
+**需求 8：** 应该能看到一个具有 `id="time-left"` 属性的元素。 注意：暂停或者运行时，该元素的内容应始终以 `mm:ss` 格式显示（如 25:00）。
-**User Story #9:** I can see a clickable element with a corresponding `id="start_stop"`.
+**需求 9：** 应该能看到一个具有 `id="start_stop"` 属性的可点击的元素。
-**User Story #10:** I can see a clickable element with a corresponding `id="reset"`.
+**需求 10：** 应该能看到一个具有 `id="reset"` 属性的可点击的元素。
-**User Story #11:** When I click the element with the id of `reset`, any running timer should be stopped, the value within `id="break-length"` should return to `5`, the value within `id="session-length"` should return to 25, and the element with `id="time-left"` should reset to it's default state.
+**需求 11：** 当点击 id 属性为 `reset` 的元素时，运行中的计时器都应该停止，`id="break-length"` 元素中的值应该重新回到 `5`，`id="session-length"` 元素中的值应该重新回到 25，且 `id="time-left"` 元素应该重置为默认状态。
-**User Story #12:** When I click the element with the id of `break-decrement`, the value within `id="break-length"` decrements by a value of 1, and I can see the updated value.
+**需求 12：** 当点击 id 属性为 `break-decrement` 的元素时，`id="break-length"` 元素的值应该减去 1，且我应该能看到更新后的值。
-**User Story #13:** When I click the element with the id of `break-increment`, the value within `id="break-length"` increments by a value of 1, and I can see the updated value.
+**需求 13：** 当点击 id 属性为 `break-increment` 的元素时，`id="break-length"` 元素的值应该增加 1，且应该能看到更新后的值。
-**User Story #14:** When I click the element with the id of `session-decrement`, the value within `id="session-length"` decrements by a value of 1, and I can see the updated value.
+**需求 14：** 当点击 id 属性为 `session-decrement` 的元素时，`id="session-length"` 元素的值应该减去 1，且应该能看到更新后的值。
-**User Story #15:** When I click the element with the id of `session-increment`, the value within `id="session-length"` increments by a value of 1, and I can see the updated value.
+**需求 15：** 当点击 id 属性为 `session-increment` 的元素时，`id="session-length"` 元素的值应该增加 1，且应该能看到更新后的值。
-**User Story #16:** I should not be able to set a session or break length to <= 0.
+**需求 16：** 工作或者休息长度不应该可以设置为 <= 0 的值。
-**User Story #17:** I should not be able to set a session or break length to > 60.
+**需求 17：** 工作或者休息长度比应该可以设置为 > 60 的值。
-**User Story #18:** When I first click the element with `id="start_stop"`, the timer should begin running from the value currently displayed in `id="session-length"`, even if the value has been incremented or decremented from the original value of 25.
+**需求 18：** 当首次点击具有 `id="start_stop"` 属性的元素时，计时器应该根据 `id="session-length"` 元素当前显示的值开始运行，即使该值已从原始值 25 递增过或递减过。
-**User Story #19:** If the timer is running, the element with the id of `time-left` should display the remaining time in `mm:ss` format (decrementing by a value of 1 and updating the display every 1000ms).
+**需求 19：** 如果计时器正在运行，id 属性为 `time-left` 的元素应该以 `mm:ss` 的格式展示剩余的时间（按1递减并且每秒更新一次显示的值）。
-**User Story #20:** If the timer is running and I click the element with `id="start_stop"`, the countdown should pause.
+**需求 20：** 如果计时器正在运行，当点击 `id="start_stop"` 元素时，倒计时应该暂停。
-**User Story #21:** If the timer is paused and I click the element with `id="start_stop"`, the countdown should resume running from the point at which it was paused.
+**需求 21：** 如果计时器已经暂停，当点击 `id="start_stop"` 元素时，倒计时应该从暂停的时间点恢复运行。
-**User Story #22:** When a session countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of `timer-label` should display a string indicating a break has begun.
+**需求 22：** 当一个工作倒计时结束（注意：计时器必须达到 00:00），并且新的倒计时开始运行时，id 属性为 `timer-label` 的元素应该显示一个表示已经开始休息的字符串。
-**User Story #23:** When a session countdown reaches zero (NOTE: timer MUST reach 00:00), a new break countdown should begin, counting down from the value currently displayed in the `id="break-length"` element.
+**需求 23：** 当一个工作倒计时结束（注意：计时器必须达到 00:00），应该开始一个新的休息倒计时，时间应该从 `id="break-length"` 元素中当前显示的值开始计算。
-**User Story #24:** When a break countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of `timer-label` should display a string indicating a session has begun.
+**需求 24：** 当一个休息倒计时结束（注意：计时器必须达到 00:00），并且新的倒计时开始运行时，id 属性为 `timer-label` 的元素应该显示一个表示已经开始工作的字符串。
-**User Story #25:** When a break countdown reaches zero (NOTE: timer MUST reach 00:00), a new session countdown should begin, counting down from the value currently displayed in the `id="session-length"` element.
+**需求 25：** 当一个休息倒计时结束（注意：计时器必须达到 00:00），应该开始一个新的工作倒计时，时间应该从 `id="session-length"` 元素中当前显示的值开始计算。
-**User Story #26:** When a countdown reaches zero (NOTE: timer MUST reach 00:00), a sound indicating that time is up should play. This should utilize an HTML5 `audio` tag and have a corresponding `id="beep"`.
+**需求 26：** 当一个倒计时结束（注意：计时器必须达到 00:00），应该播放一个表示时间到了的声音提示。 这个提示音应该使用 HTML5 的 `audio`标签并有一个 `id="beep"` 属性。
-**User Story #27:** The audio element with `id="beep"` must be 1 second or longer.
+**需求 27：** 具有`id="beep"`属性的音频元素时长应该至少有一秒。
-**User Story #28:** The audio element with id of `beep` must stop playing and be rewound to the beginning when the element with the id of `reset` is clicked.
+**需求 28：** 当点击 id 属性为 `reset` 的元素时，id 属性为 `beep` 的音频元素必须停止播放并回到开头。
-You can build your project by forking [this CodePen pen](https://codepen.io/freeCodeCamp/pen/MJjpwO). Or you can use this CDN link to run the tests in any environment you like: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
+你可以 fork [这个 CodePen 项目](https://codepen.io/freeCodeCamp/pen/MJjpwO) 来构建你的项目。 或者你可以在任何你喜欢的环境中使用以下 CDN 链接来运行测试：`https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`。
-Once you're done, submit the URL to your working project with all its tests passing.
+当你完成了本项目，并且该项目所有测试运行通过， 请提交项目的 URL。
# --solutions--
diff --git a/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-drum-machine.md b/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-drum-machine.md
index add89ca96a..84c867e2c7 100644
--- a/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-drum-machine.md
+++ b/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-drum-machine.md
@@ -1,6 +1,6 @@
---
id: 587d7dbc367417b2b2512bae
-title: Build a Drum Machine
+title: 构建一台鼓式机器
challengeType: 3
forumTopicId: 301370
dashedName: build-a-drum-machine
@@ -8,29 +8,29 @@ dashedName: build-a-drum-machine
# --description--
-**Objective:** Build a [CodePen.io](https://codepen.io) app that is functionally similar to this: .
+**目标：** 在 [CodePen.io](https://codepen.io) 上实现一个功能类似 的 App。
-Fulfill the below [user stories](https://en.wikipedia.org/wiki/User_story) and get all of the tests to pass. Give it your own personal style.
+在满足以下[需求](https://en.wikipedia.org/wiki/User_story)并能通过所有测试的前提下， 可以根据自己的喜好来美化 app。
-You can use any mix of HTML, JavaScript, CSS, Bootstrap, SASS, React, Redux, and jQuery to complete this project. You should use a frontend framework (like React for example) because this section is about learning frontend frameworks. Additional technologies not listed above are not recommended and using them is at your own risk. We are looking at supporting other frontend frameworks like Angular and Vue, but they are not currently supported. We will accept and try to fix all issue reports that use the suggested technology stack for this project. Happy coding!
+可以使用 HTML、JavaScript、CSS、Bootstrap、SASS、React、Redux、jQuery 来完成这个挑战。 但鉴于这个章节的学习内容与前端框架相关，推荐使用一款前端框架（比如 React）来完成这个挑战。 不推荐使用前面没有提到的技术，否则风险自负。 我们有计划新增其他前端框架课程，例如 Angular 和 Vue，不过目前还没有这些内容。 我们会接受并尝试修复使用推荐技术栈遇到的反馈问题。 编码愉快！
-**User Story #1:** I should be able to see an outer container with a corresponding `id="drum-machine"` that contains all other elements.
+**需求 1：** 应该可以看到一个具有 `id="drum-machine"` 属性的外层容器，该容器包含了其它所有元素。
-**User Story #2:** Within `#drum-machine` I can see an element with a corresponding `id="display"`.
+**需求 2：** 在具有 `#drum-machine` 属性的元素内，应该能看到一个具有 `id="display"` 属性的元素。
-**User Story #3:** Within `#drum-machine` I can see 9 clickable drum pad elements, each with a class name of `drum-pad`, a unique id that describes the audio clip the drum pad will be set up to trigger, and an inner text that corresponds to one of the following keys on the keyboard: Q, W, E, A, S, D, Z, X, C. The drum pads MUST be in this order.
+**需求 3：** 在具有 `#drum-machine` 属性的元素内，应该能看到 9 个可以点击的鼓垫元素，且每个鼓垫元素都应该有一个值为 `drum-pad` 的 class 属性， 一个用于描述触发鼓垫音频片段的特殊 id，以及以下键值之一的文本内容：`Q`、`W`、`E`、`A`、`S`、`D`、`Z`、`X`、`C`。 这些鼓垫必须按照以上顺序排列。
-**User Story #4:** Within each `.drum-pad`, there should be an HTML5 `audio` element which has a `src` attribute pointing to an audio clip, a class name of `clip`, and an id corresponding to the inner text of its parent `.drum-pad` (e.g. `id="Q"`, `id="W"`, `id="E"` etc.).
+**需求 4：** 在每一个具有 `.drum-pad` 属性的元素内，应该有一个具有指向音频片段地址的 `src` 属性的 HTML5 `audio` 元素，一个值为 `clip` 的 class 属性，以及一个 id 属性，它的值应该是其父元素 `.drum-pad` 的文本内容（例如 `id="Q"`、`id="W"`、`id="E"` 等等）。
-**User Story #5:** When I click on a `.drum-pad` element, the audio clip contained in its child `audio` element should be triggered.
+**需求 5：** 当点击一个具有 `.drum-pad` 属性的元素时，应该触发它的子元素 `audio` 包含的音频片段。
-**User Story #6:** When I press the trigger key associated with each `.drum-pad`, the audio clip contained in its child `audio` element should be triggered (e.g. pressing the Q key should trigger the drum pad which contains the string "Q", pressing the W key should trigger the drum pad which contains the string "W", etc.).
+**需求 6：** 当按下每一个 `.drum-pad` 元素的关联键时，应该触发其子元素 `audio` 包含的音频片段（例如：按下 `Q` 键应该触发包含字符串 `Q` 的鼓垫，按下 `W` 键应该触发包含字符串 `W` 的鼓垫等等）。
-**User Story #7:** When a `.drum-pad` is triggered, a string describing the associated audio clip is displayed as the inner text of the `#display` element (each string must be unique).
+**需求 7：** 当触发一个具有 `.drum-pad` 属性的元素时，`#display` 元素内应该展示这个触发元素关联音频片段的描述字符串（每一个字符串都应该是独一无二的）。
-You can build your project by forking [this CodePen pen](https://codepen.io/freeCodeCamp/pen/MJjpwO). Or you can use this CDN link to run the tests in any environment you like: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
+可以 fork [这个 CodePen 项目](https://codepen.io/freeCodeCamp/pen/MJjpwO) 来构建你的项目。 或者可以在任何喜欢的环境中使用以下 CDN 链接来运行测试：`https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`。
-Once you're done, submit the URL to your working project with all its tests passing.
+当你完成了本项目，并且该项目所有测试运行通过，请提交项目的 URL。
# --solutions--
diff --git a/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator.md b/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator.md
index 07a5bf85e8..ac4bda19ea 100644
--- a/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator.md
+++ b/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator.md
@@ -1,6 +1,6 @@
---
id: bd7158d8c442eddfaeb5bd17
-title: Build a JavaScript Calculator
+title: 构建一个 JavaScript 计算器
challengeType: 3
forumTopicId: 301371
dashedName: build-a-javascript-calculator
@@ -8,52 +8,52 @@ dashedName: build-a-javascript-calculator
# --description--
-**Objective:** Build a [CodePen.io](https://codepen.io) app that is functionally similar to this: .
+**目标：** 在 [CodePen.io](https://codepen.io) 上实现一个功能类似 的 App。
-Fulfill the below [user stories](https://en.wikipedia.org/wiki/User_story) and get all of the tests to pass. Give it your own personal style.
+在满足以下[需求](https://en.wikipedia.org/wiki/User_story)并能通过所有测试的前提下， 可以根据自己的喜好来美化 app。
-You can use any mix of HTML, JavaScript, CSS, Bootstrap, SASS, React, Redux, and jQuery to complete this project. You should use a frontend framework (like React for example) because this section is about learning frontend frameworks. Additional technologies not listed above are not recommended and using them is at your own risk. We are looking at supporting other frontend frameworks like Angular and Vue, but they are not currently supported. We will accept and try to fix all issue reports that use the suggested technology stack for this project. Happy coding!
+可以使用 HTML、JavaScript、CSS、Bootstrap、SASS、React、Redux、jQuery 来完成这个挑战。 但鉴于这个章节的学习内容与前端框架相关，推荐使用一款前端框架（比如 React）来完成这个挑战。 不推荐使用前面没有提到的技术，否则风险自负。 我们有计划新增其他前端框架课程，例如 Angular 和 Vue，不过目前还没有这些内容。 我们会接受并尝试修复使用推荐技术栈遇到的反馈问题。 编码愉快！
-**User Story #1:** My calculator should contain a clickable element containing an `=` (equal sign) with a corresponding `id="equals"`.
+**需求 1：** 计算器应该包含一个具有 `id="equals"` 属性的可以点击的元素，元素的文本内容为 `=`（等于符号）。
-**User Story #2:** My calculator should contain 10 clickable elements containing one number each from 0-9, with the following corresponding IDs: `id="zero"`, `id="one"`, `id="two"`, `id="three"`, `id="four"`, `id="five"`, `id="six"`, `id="seven"`, `id="eight"`, and `id="nine"`.
+**需求 2：** 计算器应该包含 10 个具有如下 id 属性的可以点击的元素，每个元素的文本内容对应 0-9 的数字：`id="zero"`、`id="one"`、`id="two"`、`id="three"`、`id="four"`、`id="five"`、`id="six"`、`id="seven"`、`id="eight"`、`id="nine"`。
-**User Story #3:** My calculator should contain 4 clickable elements each containing one of the 4 primary mathematical operators with the following corresponding IDs: `id="add"`, `id="subtract"`, `id="multiply"`, `id="divide"`.
+**需求 3：** 计算器应该包含四个可以点击的元素，文本内容对应4个主要数学运算符，且应具有如下 id 属性： `id="add"`, `id="subtract"`, `id="multiply"`, `id="divide"`。
-**User Story #4:** My calculator should contain a clickable element containing a `.` (decimal point) symbol with a corresponding `id="decimal"`.
+**需求 4：** 计算器应该包含一个可点击的 `.`（小数点）符号，对应的 `id="decimal"`。
-**User Story #5:** My calculator should contain a clickable element with an `id="clear"`.
+**需求 5：** 计算器应该包含一个具有 `id="clear"` 属性的可以点击的元素。
-**User Story #6:** My calculator should contain an element to display values with a corresponding `id="display"`.
+**需求 6：** 我的计算器应该包含一个用于展示数值的元素，这个元素具有 `id="display"` 属性。
-**User Story #7:** At any time, pressing the clear button clears the input and output values, and returns the calculator to its initialized state; 0 should be shown in the element with the id of `display`.
+**需求 7：** 在任何时候按下 `clear` 键，都会清空输入和输出的数值并且使计算器回到初始状态；此时在 id 为 `display` 的元素中应该显示数字 0。
-**User Story #8:** As I input numbers, I should be able to see my input in the element with the id of `display`.
+**需求 8：** 在输入数字的同时，应该能看到输入的数字展示在 id 为 `display` 的元素中。
-**User Story #9:** In any order, I should be able to add, subtract, multiply and divide a chain of numbers of any length, and when I hit `=`, the correct result should be shown in the element with the id of `display`.
+**需求 9：** 应该可以在任意顺序下对一串任意长度的数字执行加、减、乘、除操作，并且当按下 `=` 时，正确答案应该显示在 id 为 `display` 的元素中。
-**User Story #10:** When inputting numbers, my calculator should not allow a number to begin with multiple zeros.
+**需求 10：** 在输入数字的同时，计算器应该不允许一个数字以多个零开头。
-**User Story #11:** When the decimal element is clicked, a `.` should append to the currently displayed value; two `.` in one number should not be accepted.
+**需求 11：** 当点击小数点元素时，当前展示的数值后面应该添加一个 `.` 符号；数字中不允许出现两个 `.` 符号。
-**User Story #12:** I should be able to perform any operation (+, -, \*, /) on numbers containing decimal points.
+**需求 12：** 我可以对包含小数点的数字执行任何四则运算（`+`、`-`、`*`、`/`）。
-**User Story #13:** If 2 or more operators are entered consecutively, the operation performed should be the last operator entered (excluding the negative (-) sign). For example, if `5 + * 7 =` is entered, the result should be `35` (i.e. 5 \* 7); if `5 * - 5 =` is entered, the result should be `-25` (i.e. 5 x (-5)).
+**需求 13：** 如果连续键入了两个及以上的运算符，应该执行最后一次键入的运算符（负数（`-`）运算符除外）。 例如，如果输入 `5 + * 7 =`，结果应该是 `35` （等同于 `5 * 7`）；如果输入 `5 * - 5 =`，结果应该是 `-25`（等同于 `5 * (-5)`）。
-**User Story #14:** Pressing an operator immediately following `=` should start a new calculation that operates on the result of the previous evaluation.
+**需求 14：** 如果在按下 `=` 符号后继续按一个运算符，则应该在上一次计算结果的基础上进行新的计算。
-**User Story #15:** My calculator should have several decimal places of precision when it comes to rounding (note that there is no exact standard, but you should be able to handle calculations like `2 / 7` with reasonable precision to at least 4 decimal places).
+**需求 15：** 当需要四舍五入时，计算器可以处理结果的精度（注意：处理到多少位没有一个准确的标准，但是至少能处理类似 `2 / 7` 这样的计算，使之至少有 4 位小数的精度）。
-**Note On Calculator Logic:** It should be noted that there are two main schools of thought on calculator input logic: immediate execution logic and formula logic. Our example utilizes formula logic and observes order of operation precedence, immediate execution does not. Either is acceptable, but please note that depending on which you choose, your calculator may yield different results than ours for certain equations (see below example). As long as your math can be verified by another production calculator, please do not consider this a bug.
+**注意计算器的逻辑：** 应当注意的是，计算器输入逻辑主要有两种思路：立即执行逻辑 和 公式逻辑。 我们的示例使用公式逻辑并遵守运算优先顺序，而立即执行则不然。 两者都是可以接受的，但请注意，根据你的选择，你的计算器对于某些算式可能会得到与示例不同的计算结果（参见下面的示例）。 只要数学计算可以通过其它现实中计算器的验证，那么代码就是合理的。
-**EXAMPLE:** `3 + 5 x 6 - 2 / 4 =`
+**示例：** `3 + 5 x 6 - 2 / 4 =`
-- **Immediate Execution Logic:** `11.5`
-- **Formula/Expression Logic:** `32.5`
+- **立即执行逻辑：** `11.5`
+- **公式／表达式逻辑：** `32.5`
-You can build your project by forking [this CodePen pen](https://codepen.io/freeCodeCamp/pen/MJjpwO). Or you can use this CDN link to run the tests in any environment you like: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
+可以 fork [这个 CodePen 项目](https://codepen.io/freeCodeCamp/pen/MJjpwO) 来构建项目。 或者可以在任何喜欢的环境中使用以下 CDN 链接来运行测试：`https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`。
-Once you're done, submit the URL to your working project with all its tests passing.
+当你完成了本项目，并且该项目所有测试运行通过，请提交项目的 URL。
# --solutions--
diff --git a/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer.md b/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer.md
index 431e4ce92c..f6ebccfe79 100644
--- a/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer.md
+++ b/curriculum/challenges/chinese/03-front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer.md
@@ -1,6 +1,6 @@
---
id: bd7157d8c242eddfaeb5bd13
-title: Build a Markdown Previewer
+title: 构建一个 Markdown 文件预览器
challengeType: 3
forumTopicId: 301372
dashedName: build-a-markdown-previewer
@@ -8,29 +8,29 @@ dashedName: build-a-markdown-previewer
# --description--
-**Objective:** Build a [CodePen.io](https://codepen.io) app that is functionally similar to this: .
+**目标：** 在 [CodePen.io](https://codepen.io) 上实现一个功能类似 的 App。
-Fulfill the below [user stories](https://en.wikipedia.org/wiki/User_story) and get all of the tests to pass. Give it your own personal style.
+在满足以下[需求](https://en.wikipedia.org/wiki/User_story)并能通过所有测试的前提下， 你可以根据自己的喜好来美化 app。
-You can use any mix of HTML, JavaScript, CSS, Bootstrap, SASS, React, Redux, and jQuery to complete this project. You should use a frontend framework (like React for example) because this section is about learning frontend frameworks. Additional technologies not listed above are not recommended and using them is at your own risk. We are looking at supporting other frontend frameworks like Angular and Vue, but they are not currently supported. We will accept and try to fix all issue reports that use the suggested technology stack for this project. Happy coding!
+可以使用 HTML、JavaScript、CSS、Bootstrap、SASS、React、Redux、jQuery 来完成这个挑战。 但鉴于这个章节的学习内容与前端框架相关，推荐使用一款前端框架（比如 React）来完成这个挑战。 不推荐使用前面没有提到的技术，否则风险自负。 我们有计划新增其他前端框架课程，例如 Angular 和 Vue，不过目前还没有这些内容。 我们会接受并尝试修复使用推荐技术栈遇到的反馈问题。 编码愉快！
-**User Story #1:** I can see a `textarea` element with a corresponding `id="editor"`.
+**需求 1：** 应该能看到一个具有 `id="editor"` 属性的 `textarea` 元素。
-**User Story #2:** I can see an element with a corresponding `id="preview"`.
+**需求 2：** 应该能看到一个具有 `id="preview"` 属性的元素。
-**User Story #3:** When I enter text into the `#editor` element, the `#preview` element is updated as I type to display the content of the textarea.
+**需求 3：** 当在具有 `#editor` 属性的元素内输入文本时，具有 `#preview` 属性的元素应该同步更新展示键入的内容。
-**User Story #4:** When I enter GitHub flavored markdown into the `#editor` element, the text is rendered as HTML in the `#preview` element as I type (HINT: You don't need to parse Markdown yourself - you can import the Marked library for this: ).
+**需求 4：** 当在具有 `#editor` 属性的元素内输入 GitHub 风格的 markdown 内容时，文本应该以 HTML 的形式，把所键入的内容渲染在具有 `#preview` 属性的元素中（提示：不需要自己解析 Markdown——可以引入一个叫做 Marked 的库来完成这项工作：）。
-**User Story #5:** When my markdown previewer first loads, the default text in the `#editor` field should contain valid markdown that represents at least one of each of the following elements: a header (H1 size), a sub header (H2 size), a link, inline code, a code block, a list item, a blockquote, an image, and bolded text.
+**需求 5：** 当 Markdown 预览器首次加载时，具有 `#editor` 属性的元素内的默认内容应该包含以下每个种类的至少一段有效的 Markdown 代码：标题（H1 标签）、次级标题（H2 标签）、链接、行内代码、代码块、列表、引用块、图片、加粗文本。
-**User Story #6:** When my markdown previewer first loads, the default markdown in the `#editor` field should be rendered as HTML in the `#preview` element.
+**需求 6：** 当 Markdown 预览器首次加载时，具有 `#editor` 属性的元素内容应该以 HTML 的形式渲染在具有 `#preview` 属性的元素中。
-**Optional Bonus (you do not need to make this test pass):** My markdown previewer interprets carriage returns and renders them as `br` (line break) elements.
+**可选需求（你无需通过这项测试）：** Markdown 预览器能够解析回车符并且将他们以 `br`（换行）元素的形式渲染出来。
-You can build your project by forking [this CodePen pen](https://codepen.io/freeCodeCamp/pen/MJjpwO). Or you can use this CDN link to run the tests in any environment you like: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
+可以 fork [这个 CodePen 项目](https://codepen.io/freeCodeCamp/pen/MJjpwO) 来构建项目。 或者可以在任何喜欢的环境中使用以下 CDN 链接来运行测试：`https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`。
-Once you're done, submit the URL to your working project with all its tests passing.
+当你完成了本项目，并且该项目所有测试运行通过，请提交项目的 URL。
# --solutions--
diff --git a/curriculum/challenges/chinese/03-front-end-libraries/jquery/change-text-inside-an-element-using-jquery.md b/curriculum/challenges/chinese/03-front-end-libraries/jquery/change-text-inside-an-element-using-jquery.md
index 2e02864f61..e00ab856b4 100644
--- a/curriculum/challenges/chinese/03-front-end-libraries/jquery/change-text-inside-an-element-using-jquery.md
+++ b/curriculum/challenges/chinese/03-front-end-libraries/jquery/change-text-inside-an-element-using-jquery.md
@@ -1,6 +1,6 @@
---
id: 564944c91be2204b269d51e3
-title: Change Text Inside an Element Using jQuery
+title: 使用 jQuery 更改元素内部的文本
challengeType: 6
forumTopicId: 16773
dashedName: change-text-inside-an-element-using-jquery
@@ -8,25 +8,25 @@ dashedName: change-text-inside-an-element-using-jquery
# --description--
-Using jQuery, you can change the text between the start and end tags of an element. You can even change HTML markup.
+可以通过 jQuery 改变元素开始和结束标签之间的文本。 甚至改变 HTML 标签。
-jQuery has a function called `.html()` that lets you add HTML tags and text within an element. Any content previously within the element will be completely replaced with the content you provide using this function.
+jQuery 有一个 `.html()` 函数，能用其在标签里添加 HTML 标签和文本， 函数提供的内容将完全替换之前标签的内容。
-Here's how you would rewrite and emphasize the text of our heading:
+下面是重写并强调标题文本的代码：
`$("h3").html("jQuery Playground");`
-jQuery also has a similar function called `.text()` that only alters text without adding tags. In other words, this function will not evaluate any HTML tags passed to it, but will instead treat it as the text you want to replace the existing content with.
+jQuery 还有一个类似的函数 `.text()` 可以在不添加标签的前提下改变标签内的文本。 换言之，这个函数不会识别传入的任何 HTML 标签，而会把它当做想要替换现有内容的文本。
-Change the button with id `target4` by emphasizing its text.
+给 id 为 `target4` 的按钮的文本添加强调效果。
-[View our news article for <em>](https://www.freecodecamp.org/news/html-elements-explained-what-are-html-tags/#em-element) to learn the difference between `` and `` and their uses.
+查看此[关于 <em> 的文章](https://www.freecodecamp.org/news/html-elements-explained-what-are-html-tags/#em-element)来了解更多 `` 和 `` 的区别和用法。
-Note that while the `` tag has traditionally been used to emphasize text, it has since been adopted for use as a tag for icons. The `` tag is now widely accepted as the tag for emphasis. Either will work for this challenge.
+注意，`` 标签虽然传统上用来强调文本，但此后常用作图标的标签。 `` 标签作为强调标签现在已被广泛接受。 使用这两个标签中的任一个都可以完成本次挑战。
# --hints--
-You should emphasize the text in your `target4` button by adding HTML tags.
+应该通过添加 HTML 标签强调 `target4` 按钮中的文本。
```js
assert.isTrue(
@@ -34,25 +34,25 @@ assert.isTrue(
);
```
-The text should otherwise remain unchanged.
+文本应该保持不变。
```js
assert($('#target4') && $('#target4').text().trim() === '#target4');
```
-You should not alter any other text.
+不应该改变其它任何文本内容。
```js
assert.isFalse(/|/gi.test($('h3').html()));
```
-You should be using `.html()` and not `.text()`.
+应该使用 `.html()` 方法而不是 `.text()` 方法。
```js
assert(code.match(/\.html\(/g));
```
-You should select `button id="target4"` with jQuery.
+应该使用 jQuery 选取 `button id="target4"`。
```js
assert(code.match(/\$\(\s*?(\"|\')#target4(\"|\')\s*?\)\.html\(/));
diff --git a/curriculum/challenges/chinese/03-front-end-libraries/jquery/change-the-css-of-an-element-using-jquery.md b/curriculum/challenges/chinese/03-front-end-libraries/jquery/change-the-css-of-an-element-using-jquery.md
index aac990940e..0bcc41a0a5 100644
--- a/curriculum/challenges/chinese/03-front-end-libraries/jquery/change-the-css-of-an-element-using-jquery.md
+++ b/curriculum/challenges/chinese/03-front-end-libraries/jquery/change-the-css-of-an-element-using-jquery.md
@@ -1,6 +1,6 @@
---
id: bad87fee1348bd9aed908826
-title: Change the CSS of an Element Using jQuery
+title: 使用 jQuery 更改元素的 CSS
challengeType: 6
forumTopicId: 16776
required:
@@ -11,29 +11,29 @@ dashedName: change-the-css-of-an-element-using-jquery
# --description--
-We can also change the CSS of an HTML element directly with jQuery.
+也能用 jQuery 直接改变 HTML 标签的 CSS。
-jQuery has a function called `.css()` that allows you to change the CSS of an element.
+jQuery 有一个 `.css()` 方法，能改变标签的 CSS。
-Here's how we would change its color to blue:
+下面的代码效果是把颜色变蓝：
`$("#target1").css("color", "blue");`
-This is slightly different from a normal CSS declaration, because the CSS property and its value are in quotes, and separated with a comma instead of a colon.
+这与通常的 CSS 声明略有不同，因为这个 CSS 属性和它的值在英文引号里，并且它们用逗号而不是冒号间隔开。
-Delete your jQuery selectors, leaving an empty `document ready function`.
+删除 jQuery 选择器，并留下空的 `document ready function`。
-Select `target1` and change its color to red.
+选择 `target1` 并将其颜色变为红色（red）。
# --hints--
-Your `target1` element should have red text.
+`target1` 标签应该有红色文本。
```js
assert($('#target1').css('color') === 'rgb(255, 0, 0)');
```
-You should only use jQuery to add these classes to the element.
+应该仅用 jQuery 给标签添加类。
```js
assert(!code.match(/class.*animated/g));
diff --git a/curriculum/challenges/chinese/03-front-end-libraries/jquery/clone-an-element-using-jquery.md b/curriculum/challenges/chinese/03-front-end-libraries/jquery/clone-an-element-using-jquery.md
index 73307848d4..5cdfd0ca77 100644
--- a/curriculum/challenges/chinese/03-front-end-libraries/jquery/clone-an-element-using-jquery.md
+++ b/curriculum/challenges/chinese/03-front-end-libraries/jquery/clone-an-element-using-jquery.md
@@ -1,6 +1,6 @@
---
id: bad87fee1348bd9aed508826
-title: Clone an Element Using jQuery
+title: 使用 jQuery 克隆元素
challengeType: 6
forumTopicId: 16780
dashedName: clone-an-element-using-jquery
@@ -8,33 +8,33 @@ dashedName: clone-an-element-using-jquery
# --description--
-In addition to moving elements, you can also copy them from one place to another.
+除了移动标签，也可以把元素从一个地方复制到另一地方。
-jQuery has a function called `clone()` that makes a copy of an element.
+jQuery 有一个 `clone()` 方法，可以复制标签。
-For example, if we wanted to copy `target2` from our `left-well` to our `right-well`, we would use:
+例如，如果想把 `target2` 从 `left-well` 复制到 `right-well`，可以设置如下：
`$("#target2").clone().appendTo("#right-well");`
-Did you notice this involves sticking two jQuery functions together? This is called function chaining and it's a convenient way to get things done with jQuery.
+是否注意到这两个 jQuery 方法连在一起了？ 这被称为 链式调用（function chaining），是一种用 jQuery 实现效果的简便方法。
-Clone your `target5` element and append it to your `left-well`.
+克隆 `target5` 标签并附加到 `left-well`。
# --hints--
-Your `target5` element should be inside your `right-well`.
+`target5` 标签应该在 `right-well` 内。
```js
assert($('#right-well').children('#target5').length > 0);
```
-A copy of your `target5` element should also be inside your `left-well`.
+应该克隆 `target5` 标签并放在 `left-well` 内。
```js
assert($('#left-well').children('#target5').length > 0);
```
-You should only use jQuery to move these elements.
+应该仅用 jQuery 移动这些标签。
```js
assert(!code.match(/class.*animated/g));
diff --git a/curriculum/challenges/chinese/03-front-end-libraries/jquery/delete-your-jquery-functions.md b/curriculum/challenges/chinese/03-front-end-libraries/jquery/delete-your-jquery-functions.md
index b1ed6c05f2..41a489ab12 100644
--- a/curriculum/challenges/chinese/03-front-end-libraries/jquery/delete-your-jquery-functions.md
+++ b/curriculum/challenges/chinese/03-front-end-libraries/jquery/delete-your-jquery-functions.md
@@ -1,6 +1,6 @@
---
id: bad87fee1348bd9aeda08726
-title: Delete Your jQuery Functions
+title: 删除 jQuery 函数
challengeType: 6
forumTopicId: 17561
required:
@@ -11,37 +11,37 @@ dashedName: delete-your-jquery-functions
# --description--
-These animations were cool at first, but now they're getting kind of distracting.
+这些动画开始看起来很酷，但是有时可能会让用户分心。
-Delete all three of these jQuery functions from your `document ready function`, but leave your `document ready function` itself intact.
+请删除 `document ready function` 内的三个 jQuery 函数，但保留 `document ready function` 本身。
# --hints--
-All three of your jQuery functions should be deleted from your `document ready function`.
+应该删除 `document ready function` 中的三个 jQuery 函数。
```js
assert(code.match(/\{\s*\}\);/g));
```
-You should leave your `script` element intact.
+应该保持 `script` 标签不变。
```js
assert(code.match(/