chore(i18n,learn): processed translations (#55469)

2026-05-28 18:26:54 +00:00 · 2024-07-10 11:56:59 -05:00
parent d5459246db
commit f7129715d4
715 changed files with 14243 additions and 1129 deletions
@@ -16,7 +16,7 @@ Use an event listener to invert the value of the `isModalShowing` variable, togg
 Your `rulesContainer` should not be visible initially.

 ```js
-assert.strictEqual(rulesContainer.style.display, "");
+assert.isFalse(rulesContainer.checkVisibility());
 ```

 When your `rulesBtn` is clicked, your `isModalShowing` should be `true`.
@@ -29,7 +29,7 @@ assert.isTrue(isModalShowing);
 When your `rulesBtn` is clicked, your `rulesContainer` should be visible.

 ```js
-assert.include(["block", "inline", "inherit", "initial"], rulesContainer.style.display);
+assert.isTrue(rulesContainer.checkVisibility());
 ```

 When your `rulesBtn` is clicked, your `rulesBtn` should say `Hide Rules`.
@@ -48,7 +48,7 @@ assert.isFalse(isModalShowing);
 When your `rulesBtn` is clicked again, your `rulesContainer` should not be visible.

 ```js
-assert.include(["hidden", "none", ""], rulesContainer.style.display);
+assert.isFalse(rulesContainer.checkVisibility());
 ```

 When your `rulesBtn` is clicked again, your `rulesBtn` should say `Show Rules`.
@@ -9,7 +9,7 @@ dashedName: step-26

 在第二個 `section` 元素中，添加兩個具有 `question-block` 類的 `div` 元素。

-Then, within each `div.question-block` element, add one `h3` element with text of incrementing numbers, starting at `1`, and one `fieldset` element with a class of `question`.
+然後，在每個 `div.question-block` 元素中，添加一個帶有遞增數字文本、從 `1` 開始的 `h3` 元素，以及一個具有 `question` 類的 `fieldset` 元素。

 # --hints--

@@ -31,19 +31,19 @@ assert.equal(document.querySelectorAll('section:nth-of-type(2) > div')?.[0]?.cla
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div')?.[1]?.className, 'question-block');
 ```

-You should nest one `h3` element within each `div.question-block` element.
+你應該在每個 `div.question-block` 元素中嵌套一個 `h3` 元素。

 ```js
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')?.length, 2);
 ```

-You should give the first `h3` element text of `1`.
+你應該給第一個 `h3` 元素設置文本 `1`。

 ```js
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')?.[0]?.textContent, '1');
 ```

-You should give the second `h3` element text of `2`.
+你應該給第二個 `h3` 元素設置文本 `2`。

 ```js
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')?.[1]?.textContent, '2');
@@ -55,13 +55,13 @@ assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-bl
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > fieldset')?.length, 2);
 ```

-You should place the first `fieldset` element after the first `h3` element.
+你應該將第一個 `fieldset` 元素放在第一個 `h3` 元素之後。

 ```js
 assert.exists(document.querySelector('section:nth-of-type(2) > div.question-block > h3 + fieldset'));
 ```

-You should place the second `fieldset` element after the second `h3` element.
+你應該將第二個 `fieldset` 元素放在第二個 `h3` 元素之後。

 ```js
 assert.exists(document.querySelector('section:nth-of-type(2) > div.question-block:nth-of-type(2) > h3 + fieldset'));
@@ -9,7 +9,7 @@ dashedName: step-3

 `title` 是網頁上幾個不可見附加信息之一，但它對搜索引擎和網頁如何顯示很有用。

-Inside the `head` element, nest a `meta` element with an attribute named `charset` set to the value `utf-8` to tell the browser how to encode characters for the page.
+在`head`元素中，嵌套一個 `meta` 元素，其屬性名爲 `charset`，值爲`utf-8`，以告訴瀏覽器如何對頁面進行編碼。

 # --hints--

@@ -19,7 +19,7 @@ Inside the `head` element, nest a `meta` element with an attribute named `charse
 assert.match(code, /<meta.*?\/?>/is);
 ```

-The `meta` element is a void element, it should not have an end tag `</meta>`.
+`meta` 元素是一個空元素，它不應該有一個結束標籤 `</meta>`。

 ```js
 assert.notMatch(code, /<\/meta>/i);
@@ -7,7 +7,7 @@ dashedName: step-16

 # --description--

-Now you need to link the `styles.css` file, so the styles will be applied again. Inside the `head` element, add a `link` element. Give it a `rel` attribute with the value of `"stylesheet"` and a `href` attribute with the value of `"styles.css"`.
+現在你需要鏈接 `styles.css` 文件，以便再次應用這些樣式。 在 `head` 元素中，添加一個 `link` 元素。 設置其 `rel` 屬性值爲 `"stylesheet"`、`href` 屬性值爲 `"styles.css"`。

 # --hints--

@@ -18,7 +18,7 @@ const link = document.querySelector('link');
 assert.isNotNull(link);
 ```

-The `link` element is a void element, it should not have an end tag `</link>`.
+`link` 元素是一個空元素，它不應該有一個結束標籤 `</link>`。

 ```js
 assert.notMatch(code, /<\/link>/i);
@@ -31,7 +31,7 @@ const headElementCount = document.querySelectorAll('head')?.length;
 assert.strictEqual(headElementCount, 1);
 ```

-You should have one `link` element.
+你應該有一個 `link` 元素。

 ```js
 const linkElementCount = document.querySelectorAll('link')?.length;
@@ -9,7 +9,7 @@ dashedName: step-66

 你可以使用 `hr` 元素在不同內容的部分之間顯示一個分隔符。

-First, add an `hr` element between the `p` element with the class `established` and the first `section` element.
+首先，在具有 `established` 類的 `p` 元素和第一個 `section` 元素之間添加一個 `hr` 元素。

 # --hints--

@@ -19,27 +19,27 @@ First, add an `hr` element between the `p` element with the class `established`
 assert.match(code, /<hr\s?\/?>/i);
 ```

-The `hr` element is a void element, it should not have an end tag `</hr>`.
+`hr` 元素是一個空元素，它不應該有一個結束標籤 `</hr>`。

 ```js
 assert.notMatch(code, /<\/hr>/i);
 ```

-You should not change your existing `p` element with the class `established`.
+你不應改變你現有的具有類 `established` 的 `p` 元素。

 ```js
 const pElementCount = document.querySelectorAll('p.established')?.length;
 assert.strictEqual(pElementCount, 1);
 ```

-You should not change your existing `main` element.
+你不應該改變你現有的 `main` 元素。

 ```js
 const mainElementCount = document.querySelectorAll('main')?.length;
 assert.strictEqual(mainElementCount, 1);
 ```

-Your `hr` element should be between your `p` element and your `section` element.
+你的 `hr` 元素應該在你的 `p` 元素和 `section` 元素之間。

 ```js
 const hrElement = document.querySelector('hr');
@@ -13,27 +13,27 @@ dashedName: step-88

 # --hints--

-You should have an `<img>` tag.
+你應該有一個 `<img>` 標籤。

 ```js
 const imageElementCount = document.querySelectorAll('img')?.length;
 assert.strictEqual(imageElementCount, 1);
 ```

-The `img` element is a void element, it should not have an end tag `</img>`.
+`img` 元素是一個空元素，它不應該有一個結束標籤 `</img>`。

 ```js
 assert.notMatch(code, /<\/img>/i);
 ```

-Your `img` element should have a `src` attribute, with the value `"https://cdn.freecodecamp.org/curriculum/css-cafe/coffee.jpg"`.
+你的 `img` 元素應具有值爲 `"https://cdn.freecodecamp.org/curriculum/css-cafe/coffee.jpg"` 的 `src` 屬性。

 ```js
 const imageSrcValue = document.querySelector('img')?.getAttribute('src');
 assert.strictEqual(imageSrcValue, 'https://cdn.freecodecamp.org/curriculum/css-cafe/coffee.jpg');
 ```

-Your `img` element should have an `alt` attribute, with the value `"coffee icon"`.
+你的 `img` 元素應具有值爲 `"coffee icon"` 的 `alt` 屬性。

 ```js
 const imageAltValue = document.querySelector('img')?.getAttribute('alt');
@@ -7,7 +7,7 @@ dashedName: step-51

 # --description--

-漸變過渡通常會逐漸從一種顏色變爲另一種顏色。 When a more abrupt change is required, the transition can be made with a hard stop like this:
+漸變過渡通常會逐漸從一種顏色變爲另一種顏色。 當需要更突然的變化時，可以使用硬切換，像這樣：

 ```css
 linear-gradient(
@@ -7,7 +7,7 @@ dashedName: step-7

 # --description--

-你可以通過使用 `img` 元素來爲你的網站添加圖片。 `img` 元素只有一個開始標籤，沒有結束標籤。 An element without a closing tag is known as a <dfn>void element</dfn>.
+你可以通過使用 `img` 元素來爲你的網站添加圖片。 `img` 元素只有一個開始標籤，沒有結束標籤。 一個沒有結束標籤的元素被稱爲 <dfn>空元素</dfn>。

 在 `p` 元素的下方添加一個 `img` 元素。 此時，沒有圖片會出現在瀏覽器中。

@@ -19,7 +19,7 @@ dashedName: step-7
 assert(document.querySelector('img'));
 ```

-Your `img` element should not have a closing tag `</img>`.
+你的 `img` 元素應該沒有結束標籤 `</img>`。

 ```js
 assert(!code.match(/<\/img\>/));
@@ -7,7 +7,7 @@ dashedName: step-37

 # --description--

-`input` 元素允許你通過多種方式從 Web 表單中收集數據。 Like `img` elements, `input` elements are a <dfn>void element</dfn> and do not need closing tags.
+`input` 元素允許你通過多種方式從 Web 表單中收集數據。 與 `img` 元素一樣，`input` 元素是 <dfn>空元素</dfn>，不需要結束標籤。

 在 `form` 元素中嵌套一個 `input` 元素。

@@ -15,7 +15,7 @@ dashedName: step-44
 <input type="radio"> cat
 ```

-Remember that an `input` element is a void element.
+請記住，`input` 元素是一個空元素。

 在文本輸入之前，添加一個具有如下選項的單選按鈕：

@@ -7,7 +7,7 @@ dashedName: step-69

 # --description--

-You can set browser behavior by adding `meta` elements in the `head`. 如下所示：
+你可以通過在 `head` 添加 `meta` 元素來設置瀏覽器行爲。 如下所示：

 ```html
 <meta attribute="value">
@@ -15,13 +15,13 @@ You can set browser behavior by adding `meta` elements in the `head`. 如下所

 在 `head` 元素中，嵌套一個有 `charset` 屬性的 `meta` 元素。 設置屬性值爲 `utf-8`，這告訴瀏覽器本網頁使用什麼字符編碼。

-Note that the `meta` element is a void element.
+注意 `meta` 元素是一個空元素。

 完成最後一項更改後，你就完成了貓咪相冊應用項目。 恭喜！

 # --hints--

-You should create a `meta` element within the `head` element.
+你應該在 `head` 元素中創建一個 `meta` 元素。

 ```js
 assert.exists(document.querySelector('head > meta'));
@@ -33,7 +33,7 @@ assert.exists(document.querySelector('head > meta'));
 assert.equal(document.querySelector('head > meta')?.getAttribute('charset')?.toLowerCase(), 'utf-8');
 ```

-Your `meta` element should be a void element, you don't need to add `</meta>`.
+你的 `meta` 元素應該是一個空元素，你不需要添加 `</meta>`。

 ```js
 assert.notMatch(code, /<\/meta\s*>?/i);
@@ -7,7 +7,7 @@ dashedName: step-4

 # --description--

-Add a `title` and `meta` element inside the `head` element. Give your project a title of `Registration Form`, and add the `charset` attribute with a value of `utf-8` to your `meta` element.
+在 `head` 元素中添加一個 `title` 和 `meta` 元素。 設置項目的標題爲 `Registration Form`，給 `meta` 元素添加值爲 `utf-8` 的 `charset` 屬性。

 # --hints--

@@ -18,32 +18,32 @@ const title = document.querySelector('title');
 assert.exists(title);
 ```

-Your `title` element should be within the `head` element.
+你的 `title` 元素應該在 `head` 元素內。

 ```js
 assert.exists(document.querySelector('head > title'));
 ```

-Your project should have a title of `Registration Form`. 記住，標題的大小寫和拼寫很重要。
+你的項目應該有標題 `Registration Form`。 記住，標題的大小寫和拼寫很重要。

 ```js
 const title = document.querySelector('title');
 assert.equal(title.text, 'Registration Form');
 ```

-You should create a `meta` element within the `head` element.
+你應該在 `head` 元素中創建一個 `meta` 元素。

 ```js
 assert.exists(document.querySelector('head > meta'));
 ```

-You should give the `meta` element a `charset` attribute with the value of `utf-8`.
+你應該給 `meta` 元素一個值爲 `utf-8` 的 `charset` 屬性。

 ```js
 assert.equal(document.querySelector('head > meta')?.getAttribute('charset')?.toLowerCase(), 'utf-8');
 ```

-Your `meta` element should be a void element, it does not have an end tag `</meta>`.
+你的 `meta` 元素應該是一個空元素，它不應該有結束標籤 `</meta>`。

 ```js
 assert.notMatch(code, /<\/meta\s*>?/i);
@@ -18,19 +18,19 @@ CSS 定位可讓你設定元素在瀏覽器中的位置。 它有一個 `positio

 # --hints--

-你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `static`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `static`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.position === 'static')
 ```

-你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `100px`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `100px`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.top === '100px')
 ```

-你的 `.cat-head` 選擇器應將 `left` 屬性設置爲 `100px`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `left` 屬性設置爲 `100px`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.left === '100px')
@@ -7,57 +7,57 @@ dashedName: step-22

 # --description--

-Now you will learn a CSS trick to draw triangles.
+現在你將學習一個 CSS 技巧來繪製三角形。

-This will be used to draw ears on the cat.
+這將用於繪製貓耳朵。

-Using a class selector, give the `.cat-right-ear` element `height` and `width` properties set to `100px`. Set the `background-color` to `white`. Set the left and right borders to `35px solid blue`. Set the top and bottom borders to `35px solid red`.
+使用類選擇器，將 `.cat-right-ear` 元素的 `height` 和 `width` 屬性設置爲 `100px`。 將 `background-color` 設置爲 `white`。 將左側和右側的邊框設置爲 `35px solid blue`。 將頂部和底部的邊框設置爲 `35px solid red`。

 # --hints--

-You should have a `.cat-right-ear` selector.
+你應該有一個 `.cat-right-ear` 選擇器。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head'))
 ```

-Your `.cat-right-ear` selector should have a `height` property set to `100px`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `height` 屬性設置爲 `100px`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.height === '100px')
 ```

-Your `.cat-right-ear` selector should have a `width` property set to `100px`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `width` 屬性設置爲 `100px`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.width === '100px')
 ```

-Your `.cat-right-ear` selector should have a `background-color` property set to `white`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `background-color` 屬性設置爲 `white`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.backgroundColor === 'white')
 ```

-Your `.cat-right-ear` selector should have a `border-left` property set to `35px solid blue`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應設置一個 `border-left` 屬性爲 `35px solid blue`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderLeft === '35px solid blue')
 ```

-Your `.cat-right-ear` selector should have a `border-right` property set to `35px solid blue`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應設置一個 `border-right` 屬性爲 `35px solid blue`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderRight === '35px solid blue')
 ```

-Your `.cat-right-ear` selector should have a `border-top` property set to `35px solid red`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應設置一個 `border-top` 屬性爲 `35px solid red`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderTop === '35px solid red')
 ```

-Your `.cat-right-ear` selector should have a `border-bottom` property set to `35px solid red`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應設置一個 `border-bottom` 屬性爲 `35px solid red`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderBottom === '35px solid red')
@@ -1,6 +1,6 @@
 ---
 id: 646cecc9eb5c4f4f73dafd07
-title: Step 25
+title: 步驟 25
 challengeType: 0
 dashedName: step-25
 ---
@@ -11,7 +11,7 @@ dashedName: step-25

 # --hints--

-你的 `.cat-left-ear` 選擇器應該具有一個 `position` 屬性並設置爲 `absolute`。 Don't forget to add a semicolon.
+你的 `.cat-left-ear` 選擇器應該具有一個 `position` 屬性並設置爲 `absolute`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.position === 'absolute')
@@ -1,6 +1,6 @@
 ---
 id: 646cef0c2b98915094df7099
-title: Step 26
+title: 步驟 26
 challengeType: 0
 dashedName: step-26
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646cf1206cac5f51804f49cf
-title: Step 27
+title: 步驟 27
 challengeType: 0
 dashedName: step-27
 ---
@@ -15,7 +15,7 @@ dashedName: step-27

 # --hints--

-你應該將你的 `.cat-left-ear` 元素的 `transform` 屬性設置爲 `rotate(-45deg)`。 Don't forget to add a semicolon.
+你應該將你的 `.cat-left-ear` 元素的 `transform` 屬性設置爲 `rotate(-45deg)`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.transform === 'rotate(-45deg)')
@@ -1,6 +1,6 @@
 ---
 id: 646cf2249f02ca5233d9af7c
-title: Step 28
+title: 步驟 28
 challengeType: 0
 dashedName: step-28
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646cf48d8f8e1f535a1821d3
-title: Step 29
+title: 步驟 29
 challengeType: 0
 dashedName: step-29
 ---
@@ -11,7 +11,7 @@ dashedName: step-29

 # --hints--

-你的 `.cat-right-ear` 選擇器應設置 `position` 屬性爲 `absolute`。 Don't forget to add a semicolon.
+你的 `.cat-right-ear` 選擇器應設置 `position` 屬性爲 `absolute`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.position === 'absolute')
@@ -1,6 +1,6 @@
 ---
 id: 646cf6cbca98e258da65c979
-title: Step 30
+title: 步驟 30
 challengeType: 0
 dashedName: step-30
 ---
@@ -11,7 +11,7 @@ dashedName: step-30

 # --hints--

-你應該將你的 `.cat-right-ear` 元素的 `transform` 屬性設置爲 `rotate(45deg)`。 Don't forget to add a semicolon.
+你應該將你的 `.cat-right-ear` 元素的 `transform` 屬性設置爲 `rotate(45deg)`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.transform === 'rotate(45deg)')
@@ -1,6 +1,6 @@
 ---
 id: 646cf88aa884405a11ea5bcc
-title: Step 31
+title: 步驟 31
 challengeType: 0
 dashedName: step-31
 ---
@@ -11,13 +11,13 @@ dashedName: step-31

 # --hints--

-你的 `.cat-right-ear` 選擇器應該設置一個 `border-top-left-radius` 屬性值爲 `90px`。 Don't forget to add a semicolon.
+你的 `.cat-right-ear` 選擇器應該設置一個 `border-top-left-radius` 屬性值爲 `90px`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderTopLeftRadius === '90px')
 ```

-你的 `.cat-right-ear` 選擇器應設置一個 `border-top-right-radius` 屬性爲 `10px`。 Don't forget to add a semicolon.
+你的 `.cat-right-ear` 選擇器應設置一個 `border-top-right-radius` 屬性爲 `10px`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderTopRightRadius === '10px')
@@ -1,6 +1,6 @@
 ---
 id: 646cfc2b8e6fe95c20a819d5
-title: Step 32
+title: 步驟 32
 challengeType: 0
 dashedName: step-32
 ---
@@ -15,7 +15,7 @@ dashedName: step-32

 # --hints--

-你的 `.cat-left-ear` 選擇器應該有一個 `z-index` 爲 `-1`。 Don't forget to add a semicolon.
+你的 `.cat-left-ear` 選擇器應該有一個 `z-index` 爲 `-1`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.zIndex === '-1')
@@ -1,6 +1,6 @@
 ---
 id: 646cfd853634255d02b64cc1
-title: Step 33
+title: 步驟 33
 challengeType: 0
 dashedName: step-33
 ---
@@ -13,7 +13,7 @@ dashedName: step-33

 # --hints--

-你的 `.cat-left-ear` 選擇器應該有一個 `z-index` 值爲 `1`。 Don't forget to add a semicolon.
+你的 `.cat-left-ear` 選擇器應該有一個 `z-index` 值爲 `1`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.zIndex === '1')
@@ -1,6 +1,6 @@
 ---
 id: 646cfde6ac612e5d60391f50
-title: Step 34
+title: 步驟 34
 challengeType: 0
 dashedName: step-34
 ---
@@ -11,7 +11,7 @@ dashedName: step-34

 # --hints--

-你的 `.cat-right-ear` 選擇器應該有一個 `z-index` 爲 `1`。 Don't forget to add a semicolon.
+你的 `.cat-right-ear` 選擇器應該有一個 `z-index` 爲 `1`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.zIndex === '1')
@@ -1,6 +1,6 @@
 ---
 id: 646dd556d524bc61c0139bd6
-title: Step 35
+title: 步驟 35
 challengeType: 0
 dashedName: step-35
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dd6f9caa862627dd87772
-title: Step 36
+title: 步驟 36
 challengeType: 0
 dashedName: step-36
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dd7cfd0cfac630c1dd520
-title: Step 37
+title: 步驟 37
 challengeType: 0
 dashedName: step-37
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dd8c79ec23463a3d0e356
-title: Step 38
+title: 步驟 38
 challengeType: 0
 dashedName: step-38
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dd9d9a729916460724f16
-title: Step 39
+title: 步驟 39
 challengeType: 0
 dashedName: step-39
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646ddab8afd73764f5241bbf
-title: Step 40
+title: 步驟 40
 challengeType: 0
 dashedName: step-40
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646ddb61ff08366570cc5902
-title: Step 41
+title: 步驟 41
 challengeType: 0
 dashedName: step-41
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646ddd3f9f97a0667b964bdb
-title: Step 42
+title: 步驟 42
 challengeType: 0
 dashedName: step-42
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dde7dc20dc167489faa69
-title: Step 43
+title: 步驟 43
 challengeType: 0
 dashedName: step-43
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646ddf888632fa67f1180940
-title: Step 44
+title: 步驟 44
 challengeType: 0
 dashedName: step-44
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646de5dc8988076a1d992afd
-title: Step 45
+title: 步驟 45
 challengeType: 0
 dashedName: step-45
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646de6a97b50a86ac487de86
-title: Step 46
+title: 步驟 46
 challengeType: 0
 dashedName: step-46
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646de7b64467e96b7d35b5cd
-title: Step 47
+title: 步驟 47
 challengeType: 0
 dashedName: step-47
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646de8478d6f796bfbdccfb2
-title: Step 48
+title: 步驟 48
 challengeType: 0
 dashedName: step-48
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646de8d204a3426c7d184372
-title: Step 49
+title: 步驟 49
 challengeType: 0
 dashedName: step-49
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dea1c98c2426d43a705c3
-title: Step 50
+title: 步驟 50
 challengeType: 0
 dashedName: step-50
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646deb169847f86df0f95bfc
-title: Step 51
+title: 步驟 51
 challengeType: 0
 dashedName: step-51
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dec359bef3b7811fba5a6
-title: Step 52
+title: 步驟 52
 challengeType: 0
 dashedName: step-52
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dedbcba062079128b2ecc
-title: Step 53
+title: 步驟 53
 challengeType: 0
 dashedName: step-53
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646def5e863abf7a14501421
-title: Step 54
+title: 步驟 54
 challengeType: 0
 dashedName: step-54
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646df03c8f79337ab46f148b
-title: Step 55
+title: 步驟 55
 challengeType: 0
 dashedName: step-55
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646df0cf26413a7b35e4b8b3
-title: Step 56
+title: 步驟 56
 challengeType: 0
 dashedName: step-56
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646df1d1aa4ae57bdf1869c4
-title: Step 57
+title: 步驟 57
 challengeType: 0
 dashedName: step-57
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646dffd8ce9ac77ec1906f2e
-title: Step 58
+title: 步驟 58
 challengeType: 0
 dashedName: step-58
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f0417322c0e04983a5149
-title: Step 61
+title: 步驟 61
 challengeType: 0
 dashedName: step-61
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f08293804a30685533c6f
-title: Step 62
+title: 步驟 62
 challengeType: 0
 dashedName: step-62
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f09293eb3230723a62f77
-title: Step 63
+title: 步驟 63
 challengeType: 0
 dashedName: step-63
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f0c9a1e3360092d1bbd33
-title: Step 64
+title: 步驟 64
 challengeType: 0
 dashedName: step-64
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f0ce5737243098ad6e494
-title: Step 65
+title: 步驟 65
 challengeType: 0
 dashedName: step-65
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f0ef13604420a8744f7d4
-title: Step 66
+title: 步驟 66
 challengeType: 0
 dashedName: step-66
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f0f7c5933560af8e7e380
-title: Step 67
+title: 步驟 67
 challengeType: 0
 dashedName: step-67
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f102bf87b350b593baa72
-title: Step 68
+title: 步驟 68
 challengeType: 0
 dashedName: step-68
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f107abb89d00bb99f387a
-title: Step 69
+title: 步驟 69
 challengeType: 0
 dashedName: step-69
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f12da0b4c5d0ca162834a
-title: Step 71
+title: 步驟 71
 challengeType: 0
 dashedName: step-71
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f135eab69d90d0c6d4e9b
-title: Step 72
+title: 步驟 72
 challengeType: 0
 dashedName: step-72
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f159b2cffb21150b927cb
-title: Step 73
+title: 步驟 73
 challengeType: 0
 dashedName: step-73
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f164bf100dd11d226161f
-title: Step 74
+title: 步驟 74
 challengeType: 0
 dashedName: step-74
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f1764e2f1d212ba9785a7
-title: Step 75
+title: 步驟 75
 challengeType: 0
 dashedName: step-75
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f1802a09a171332e14630
-title: Step 76
+title: 步驟 76
 challengeType: 0
 dashedName: step-76
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f4d6c42dc5f214f4e7444
-title: Step 77
+title: 步驟 77
 challengeType: 0
 dashedName: step-77
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f4e46e81f7021d5fd9c1d
-title: Step 78
+title: 步驟 78
 challengeType: 0
 dashedName: step-78
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f4f6a14e3c522d130a0d2
-title: Step 79
+title: 步驟 79
 challengeType: 0
 dashedName: step-79
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f4fe12b7985232bf475a5
-title: Step 80
+title: 步驟 80
 challengeType: 0
 dashedName: step-80
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f507e4d1cd323f17db4fc
-title: Step 81
+title: 步驟 81
 challengeType: 0
 dashedName: step-81
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646f516dbfc1342495515625
-title: Step 82
+title: 步驟 82
 challengeType: 0
 dashedName: step-82
 ---
@@ -15,19 +15,19 @@ dashedName: step-10

 # --hints--

-你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `relative`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `relative`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.position === 'relative')
 ```

-你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `100px`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `100px`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.top === '100px')
 ```

-你的 `.cat-head` 選擇器應將 `left` 屬性設置爲 `100px`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `left` 屬性設置爲 `100px`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.left === '100px')
@@ -9,26 +9,26 @@ dashedName: step-11

 下一個位置屬性是 `absolute`。 當你爲 `position` 屬性使用 `absolute` 值時，該元素將從文檔的正常流程中取出，然後其位置由 `top`、`right`、`bottom` 和 `left` 屬性決定。

-Set the `position` property of your `.cat-head` element to `absolute`, then set `top` and `left` properties to any positive pixel value.
+將你的 `.cat-head` 元素的 `position` 屬性設置爲 `absolute`，然後將 `top` 和 `left` 屬性設置爲任意正像素值。

 <!-- **Note**: You can experiment with `top`, `left`, `bottom`, and `right` properties here, but the test would only pass for `top` of `300px`, and left of `400px`. -->

 # --hints--

-你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `absolute`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `absolute`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.position === 'absolute')
 ```

-你的 `.cat-head` 選擇器應將 `top` 屬性設置爲以 `px` 結尾的任意數字。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `top` 屬性設置爲以 `px` 結尾的任意數字。 確保你添加了分號。

 ```js
 // assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.top === '300px')
 assert.match(code, /top:\s*\d{1,4}px;/)
 ```

-你的 `.cat-head` 選擇器應將 `left` 屬性設置爲以 `px` 結尾的任意數字。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `left` 屬性設置爲以 `px` 結尾的任意數字。 確保你添加了分號。

 ```js
 // assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.left === '400px')
@@ -13,19 +13,19 @@ dashedName: step-14

 # --hints--

-你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `fixed`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `fixed`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.position === 'fixed')
 ```

-你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `100px`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `100px`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.top === '100px')
 ```

-你的 `.cat-head` 選擇器應將 `left` 屬性設置爲 `100px`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `left` 屬性設置爲 `100px`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.left === '100px')
@@ -15,13 +15,13 @@ dashedName: step-15

 # --hints--

-你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `sticky`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `sticky`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.position === 'sticky')
 ```

-你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `0`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `0`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.top === '0px')
@@ -13,37 +13,37 @@ dashedName: step-16

 # --hints--

-你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `absolute`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `position` 屬性設置爲 `absolute`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.position === 'absolute')
 ```

-你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `0`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `top` 屬性設置爲 `0`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.top === '0px')
 ```

-你的 `.cat-head` 選擇器應將 `left` 屬性設置爲 `0`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `left` 屬性設置爲 `0`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.left === '0px')
 ```

-你的 `.cat-head` 選擇器應將 `right` 屬性設置爲 `0`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `right` 屬性設置爲 `0`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.right === '0px')
 ```

-你的 `.cat-head` 選擇器應將 `bottom` 屬性設置爲 `0`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `bottom` 屬性設置爲 `0`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.bottom === '0px')
 ```

-你的 `.cat-head` 選擇器應將 `margin` 屬性設置爲 `auto`。 Make sure you add a semicolon.
+你的 `.cat-head` 選擇器應將 `margin` 屬性設置爲 `auto`。 確保你添加了分號。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.margin === 'auto')
@@ -1,6 +1,6 @@
 ---
 id: 64a2687ef267e5934a2f93e3
-title: Step 59
+title: 步驟 59
 challengeType: 0
 dashedName: step-59
 ---
@@ -1,6 +1,6 @@
 ---
 id: 64a26ac5540c5493f4641f10
-title: Step 60
+title: 步驟 60
 challengeType: 0
 dashedName: step-60
 ---
@@ -1,6 +1,6 @@
 ---
 id: 64a3bcbc83e574b58c8ed048
-title: Step 70
+title: 步驟 70
 challengeType: 0
 dashedName: step-70
 ---
@@ -1,83 +1,83 @@
 ---
 id: 6676a8a8d9861319ee901a90
-title: Step 24
+title: 步驟 24
 challengeType: 0
 dashedName: step-24
 ---

 # --description--

-Now you can begin working on your cat's ears.
+現在你可以開始繪製貓耳朵。

-Clean up your review code by removing the `.cat-right-ear` selector and all of its properties.
+通過刪除 `.cat-right-ear` 選擇器及其所有屬性來清理你的審覈代碼。

-Using a class selector, give the `.cat-left-ear` element a left and right border of `35px solid transparent` each. Also, set the bottom border to `70px solid #5e5e5e`.
+使用類選擇器，給 `.cat-left-ear` 元素左右各添加 `35px solid transparent` 的邊框。 另外，將底部邊框設置爲 `70px solid #5e5e5e`。

 # --hints--


-Your `.cat-right-ear` selector should not have a `height` property.
+你的 `.cat-right-ear` 選擇器不應該有 `height` 屬性。

 ```js
 assert(!new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.height)
 ```

-Your `.cat-right-ear` selector should not have a `width` property.
+你的 `.cat-right-ear` 選擇器不應該有 `width` 屬性。

 ```js
 assert(!new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.width)
 ```


-Your `.cat-right-ear` selector should not have a `border-left` property.
+你的 `.cat-right-ear` 選擇器不應該有 `border-left` 屬性。

 ```js
 assert(!new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderLeft)
 ```

-Your `.cat-right-ear` selector should not have a `border-right` property.
+你的 `.cat-right-ear` 選擇器不應該有 `border-right` 屬性。

 ```js
 assert(!new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderRight)
 ```

-Your `.cat-right-ear` selector should not have a `border-top` property.
+你的 `.cat-right-ear` 選擇器不應該有 `border-top` 屬性。

 ```js
 assert(!new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderTop)
 ```

-Your `.cat-right-ear` selector should not have a `border-bottom` property.
+你的 `.cat-right-ear` 選擇器不應該有 `border-bottom` 屬性。

 ```js
 assert(!new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderBottom)
 ```

-You should not have a `.cat-right-ear` selector.
+你不應該有 `.cat-right-ear` 選擇器。

 ```js
 assert(!new __helpers.CSSHelp(document)?.getStyle('.cat-right-ear'))
 ```

-You should have a `.cat-left-ear` selector.
+你應該有 `.cat-left-ear` 選擇器。

 ```js 
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear'))
 ```

-Your `.cat-left-ear` selector should have a `border-left` property set to `35px solid transparent`
+你的 `.cat-left-ear` 選擇器應該有一個值爲 `35px solid transparent` 的 `border-left` 屬性。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderLeft === '35px solid transparent')
 ```

-Your `.cat-left-ear` selector should have a `border-right` property set to `35px solid transparent`
+你的 `.cat-left-ear` 選擇器應該有一個值爲 `35px solid transparent` 的 `border-right` 屬性。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderRight === '35px solid transparent')
 ```

-Your `.cat-left-ear` selector should have a `border-bottom` property set to `70px solid #5e5e5e`
+你的 `.cat-left-ear` 選擇器應該有一個值爲 `70px solid #5e5e5e` 的 `border-bottom` 屬性。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderBottom === '70px solid rgb(94, 94, 94)')
@@ -1,65 +1,65 @@
 ---
 id: 6676a8b01e56ec1a1e07c202
-title: Step 23
+title: 步驟-23
 challengeType: 0
 dashedName: step-23
 ---

 # --description--

-Notice that you now have a white square with thick borders. The borders have diagonal edges which can be used to create triangles.
+注意你現在有一個厚邊框的白色方塊。 邊框有對角線，可用於創建三角形。

-Within the same class selector adjust `height` and `width` to `0`. Set the left, right and top border to `transparent`.
+在同一個類選擇器中，將 `height` 和 `width` 調整爲 `0`。 將左側、右側和頂部邊框設置爲 `transparent`。

-Remove the `background-color` property, and you should see a triangle.
+刪除 `background-color` 屬性，你應該看到一個三角形。

 # --hints--


-You should have a `.cat-right-ear` selector.
+你應該有 `.cat-right-ear` 選擇器。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-right-ear'))
 ```

-Your `.cat-right-ear` selector should have a `height` property set to `0`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `height` 屬性設置爲 `0`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.height == '0px')
 ```

-Your `.cat-right-ear` selector should have a `width` property set to `0`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `width` 屬性設置爲 `0`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.width === '0px')
 ```

-Your `.cat-right-ear` selector should have a `border-left` property set to `35px solid transparent`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `border-left` 屬性設置爲 `35px solid transparent`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderLeft === '35px solid transparent')
 ```

-Your `.cat-right-ear` selector should have a `border-right` property set to `35px solid transparent`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `border-right` 屬性爲 `35px solid transparent`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderRight === '35px solid transparent')
 ```

-Your `.cat-right-ear` selector should have a `border-top` property set to `35px solid transparent`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `border-top` 屬性設置爲 `35px solid transparent`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderTop === '35px solid transparent')
 ```


-Your `.cat-right-ear` selector should have a `border-bottom` property set to `35px solid red`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 選擇器應將 `border-bottom` 屬性爲 `35px solid red`。 不要忘記加上分號。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderBottom === '35px solid red')
 ```

-Your `.cat-right-ear` selector should not have a `background-color` property.
+你的 `.cat-right-ear` 選擇器不應該有 `background-color` 屬性。

 ```js
 assert(!new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.backgroundColor)
@@ -16,7 +16,7 @@ Use an event listener to invert the value of the `isModalShowing` variable, togg
 Your `rulesContainer` should not be visible initially.

 ```js
-assert.strictEqual(rulesContainer.style.display, "");
+assert.isFalse(rulesContainer.checkVisibility());
 ```

 When your `rulesBtn` is clicked, your `isModalShowing` should be `true`.
@@ -29,7 +29,7 @@ assert.isTrue(isModalShowing);
 When your `rulesBtn` is clicked, your `rulesContainer` should be visible.

 ```js
-assert.include(["block", "inline", "inherit", "initial"], rulesContainer.style.display);
+assert.isTrue(rulesContainer.checkVisibility());
 ```

 When your `rulesBtn` is clicked, your `rulesBtn` should say `Hide Rules`.
@@ -48,7 +48,7 @@ assert.isFalse(isModalShowing);
 When your `rulesBtn` is clicked again, your `rulesContainer` should not be visible.

 ```js
-assert.include(["hidden", "none", ""], rulesContainer.style.display);
+assert.isFalse(rulesContainer.checkVisibility());
 ```

 When your `rulesBtn` is clicked again, your `rulesBtn` should say `Show Rules`.
@@ -9,7 +9,7 @@ dashedName: step-26

 在第二个 `section` 元素中，添加两个具有 `question-block` 类的 `div` 元素。

-Then, within each `div.question-block` element, add one `h3` element with text of incrementing numbers, starting at `1`, and one `fieldset` element with a class of `question`.
+然后，在每个 `div.question-block` 元素中，添加一个带有递增数字文本、从 `1` 开始的 `h3` 元素，以及一个具有 `question` 类的 `fieldset` 元素。

 # --hints--

@@ -31,19 +31,19 @@ assert.equal(document.querySelectorAll('section:nth-of-type(2) > div')?.[0]?.cla
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div')?.[1]?.className, 'question-block');
 ```

-You should nest one `h3` element within each `div.question-block` element.
+你应该在每个 `div.question-block` 元素中嵌套一个 `h3` 元素。

 ```js
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')?.length, 2);
 ```

-You should give the first `h3` element text of `1`.
+你应该给第一个 `h3` 元素设置文本 `1`。

 ```js
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')?.[0]?.textContent, '1');
 ```

-You should give the second `h3` element text of `2`.
+你应该给第二个 `h3` 元素设置文本 `2`。

 ```js
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > h3')?.[1]?.textContent, '2');
@@ -55,13 +55,13 @@ assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-bl
 assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > fieldset')?.length, 2);
 ```

-You should place the first `fieldset` element after the first `h3` element.
+你应该将第一个 `fieldset` 元素放在第一个 `h3` 元素之后。

 ```js
 assert.exists(document.querySelector('section:nth-of-type(2) > div.question-block > h3 + fieldset'));
 ```

-You should place the second `fieldset` element after the second `h3` element.
+你应该将第二个 `fieldset` 元素放在第二个 `h3` 元素之后。

 ```js
 assert.exists(document.querySelector('section:nth-of-type(2) > div.question-block:nth-of-type(2) > h3 + fieldset'));
@@ -9,7 +9,7 @@ dashedName: step-3

 `title` 是网页上几个不可见附加信息之一，但它对搜索引擎和网页如何显示很有用。

-Inside the `head` element, nest a `meta` element with an attribute named `charset` set to the value `utf-8` to tell the browser how to encode characters for the page.
+在`head`元素中，嵌套一个 `meta` 元素，其属性名为 `charset`，值为`utf-8`，以告诉浏览器如何对页面进行编码。

 # --hints--

@@ -19,7 +19,7 @@ Inside the `head` element, nest a `meta` element with an attribute named `charse
 assert.match(code, /<meta.*?\/?>/is);
 ```

-The `meta` element is a void element, it should not have an end tag `</meta>`.
+`meta` 元素是一个空元素，它不应该有一个结束标签 `</meta>`。

 ```js
 assert.notMatch(code, /<\/meta>/i);
@@ -7,7 +7,7 @@ dashedName: step-16

 # --description--

-Now you need to link the `styles.css` file, so the styles will be applied again. Inside the `head` element, add a `link` element. Give it a `rel` attribute with the value of `"stylesheet"` and a `href` attribute with the value of `"styles.css"`.
+现在你需要链接 `styles.css` 文件，以便再次应用这些样式。 在 `head` 元素中，添加一个 `link` 元素。 设置其 `rel` 属性值为 `"stylesheet"`、`href` 属性值为 `"styles.css"`。

 # --hints--

@@ -18,7 +18,7 @@ const link = document.querySelector('link');
 assert.isNotNull(link);
 ```

-The `link` element is a void element, it should not have an end tag `</link>`.
+`link` 元素是一个空元素，它不应该有一个结束标签 `</link>`。

 ```js
 assert.notMatch(code, /<\/link>/i);
@@ -31,7 +31,7 @@ const headElementCount = document.querySelectorAll('head')?.length;
 assert.strictEqual(headElementCount, 1);
 ```

-You should have one `link` element.
+你应该有一个 `link` 元素。

 ```js
 const linkElementCount = document.querySelectorAll('link')?.length;
@@ -9,7 +9,7 @@ dashedName: step-66

 你可以使用 `hr` 元素在不同内容的部分之间显示一个分隔符。

-First, add an `hr` element between the `p` element with the class `established` and the first `section` element.
+首先，在具有 `established` 类的 `p` 元素和第一个 `section` 元素之间添加一个 `hr` 元素。

 # --hints--

@@ -19,27 +19,27 @@ First, add an `hr` element between the `p` element with the class `established`
 assert.match(code, /<hr\s?\/?>/i);
 ```

-The `hr` element is a void element, it should not have an end tag `</hr>`.
+`hr` 元素是一个空元素，它不应该有一个结束标签 `</hr>`。

 ```js
 assert.notMatch(code, /<\/hr>/i);
 ```

-You should not change your existing `p` element with the class `established`.
+你不应改变你现有的具有类 `established` 的 `p` 元素。

 ```js
 const pElementCount = document.querySelectorAll('p.established')?.length;
 assert.strictEqual(pElementCount, 1);
 ```

-You should not change your existing `main` element.
+你不应该改变你现有的 `main` 元素。

 ```js
 const mainElementCount = document.querySelectorAll('main')?.length;
 assert.strictEqual(mainElementCount, 1);
 ```

-Your `hr` element should be between your `p` element and your `section` element.
+你的 `hr` 元素应该在你的 `p` 元素和 `section` 元素之间。

 ```js
 const hrElement = document.querySelector('hr');
@@ -13,27 +13,27 @@ dashedName: step-88

 # --hints--

-You should have an `<img>` tag.
+你应该有一个 `<img>` 标签。

 ```js
 const imageElementCount = document.querySelectorAll('img')?.length;
 assert.strictEqual(imageElementCount, 1);
 ```

-The `img` element is a void element, it should not have an end tag `</img>`.
+`img` 元素是一个空元素，它不应该有一个结束标签 `</img>`。

 ```js
 assert.notMatch(code, /<\/img>/i);
 ```

-Your `img` element should have a `src` attribute, with the value `"https://cdn.freecodecamp.org/curriculum/css-cafe/coffee.jpg"`.
+你的 `img` 元素应具有值为 `"https://cdn.freecodecamp.org/curriculum/css-cafe/coffee.jpg"` 的 `src` 属性。

 ```js
 const imageSrcValue = document.querySelector('img')?.getAttribute('src');
 assert.strictEqual(imageSrcValue, 'https://cdn.freecodecamp.org/curriculum/css-cafe/coffee.jpg');
 ```

-Your `img` element should have an `alt` attribute, with the value `"coffee icon"`.
+你的 `img` 元素应具有值为 `"coffee icon"` 的 `alt` 属性。

 ```js
 const imageAltValue = document.querySelector('img')?.getAttribute('alt');
@@ -7,7 +7,7 @@ dashedName: step-51

 # --description--

-渐变过渡通常会逐渐从一种颜色变为另一种颜色。 When a more abrupt change is required, the transition can be made with a hard stop like this:
+渐变过渡通常会逐渐从一种颜色变为另一种颜色。 当需要更突然的变化时，可以使用硬切换，像这样：

 ```css
 linear-gradient(
@@ -7,7 +7,7 @@ dashedName: step-7

 # --description--

-你可以通过使用 `img` 元素来为你的网站添加图片。 `img` 元素只有一个开始标签，没有结束标签。 An element without a closing tag is known as a <dfn>void element</dfn>.
+你可以通过使用 `img` 元素来为你的网站添加图片。 `img` 元素只有一个开始标签，没有结束标签。 一个没有结束标签的元素被称为 <dfn>空元素</dfn>。

 在 `p` 元素的下方添加一个 `img` 元素。 此时，没有图片会出现在浏览器中。

@@ -19,7 +19,7 @@ dashedName: step-7
 assert(document.querySelector('img'));
 ```

-Your `img` element should not have a closing tag `</img>`.
+你的 `img` 元素应该没有结束标签 `</img>`。

 ```js
 assert(!code.match(/<\/img\>/));
@@ -7,7 +7,7 @@ dashedName: step-37

 # --description--

-`input` 元素允许你通过多种方式从 Web 表单中收集数据。 Like `img` elements, `input` elements are a <dfn>void element</dfn> and do not need closing tags.
+`input` 元素允许你通过多种方式从 Web 表单中收集数据。 与 `img` 元素一样，`input` 元素是 <dfn>空元素</dfn>，不需要结束标签。

 在 `form` 元素中嵌套一个 `input` 元素。

@@ -15,7 +15,7 @@ dashedName: step-44
 <input type="radio"> cat
 ```

-Remember that an `input` element is a void element.
+请记住，`input` 元素是一个空元素。

 在文本输入之前，添加一个具有如下选项的单选按钮：

@@ -7,7 +7,7 @@ dashedName: step-69

 # --description--

-You can set browser behavior by adding `meta` elements in the `head`. 如下所示：
+你可以通过在 `head` 添加 `meta` 元素来设置浏览器行为。 如下所示：

 ```html
 <meta attribute="value">
@@ -15,13 +15,13 @@ You can set browser behavior by adding `meta` elements in the `head`. 如下所

 在 `head` 元素中，嵌套一个有 `charset` 属性的 `meta` 元素。 设置属性值为 `utf-8`，这告诉浏览器本网页使用什么字符编码。

-Note that the `meta` element is a void element.
+注意 `meta` 元素是一个空元素。

 完成最后一项更改后，你就完成了猫咪相册应用项目。 恭喜！

 # --hints--

-You should create a `meta` element within the `head` element.
+你应该在 `head` 元素中创建一个 `meta` 元素。

 ```js
 assert.exists(document.querySelector('head > meta'));
@@ -33,7 +33,7 @@ assert.exists(document.querySelector('head > meta'));
 assert.equal(document.querySelector('head > meta')?.getAttribute('charset')?.toLowerCase(), 'utf-8');
 ```

-Your `meta` element should be a void element, you don't need to add `</meta>`.
+你的 `meta` 元素应该是一个空元素，你不需要添加 `</meta>`。

 ```js
 assert.notMatch(code, /<\/meta\s*>?/i);
@@ -7,7 +7,7 @@ dashedName: step-4

 # --description--

-Add a `title` and `meta` element inside the `head` element. Give your project a title of `Registration Form`, and add the `charset` attribute with a value of `utf-8` to your `meta` element.
+在 `head` 元素中添加一个 `title` 和 `meta` 元素。 设置项目的标题为 `Registration Form`，给 `meta` 元素添加值为 `utf-8` 的 `charset` 属性。

 # --hints--

@@ -18,32 +18,32 @@ const title = document.querySelector('title');
 assert.exists(title);
 ```

-Your `title` element should be within the `head` element.
+你的 `title` 元素应该在 `head` 元素内。

 ```js
 assert.exists(document.querySelector('head > title'));
 ```

-Your project should have a title of `Registration Form`. 记住，标题的大小写和拼写很重要。
+你的项目应该有标题 `Registration Form`。 记住，标题的大小写和拼写很重要。

 ```js
 const title = document.querySelector('title');
 assert.equal(title.text, 'Registration Form');
 ```

-You should create a `meta` element within the `head` element.
+你应该在 `head` 元素中创建一个 `meta` 元素。

 ```js
 assert.exists(document.querySelector('head > meta'));
 ```

-You should give the `meta` element a `charset` attribute with the value of `utf-8`.
+你应该给 `meta` 元素一个值为 `utf-8` 的 `charset` 属性。

 ```js
 assert.equal(document.querySelector('head > meta')?.getAttribute('charset')?.toLowerCase(), 'utf-8');
 ```

-Your `meta` element should be a void element, it does not have an end tag `</meta>`.
+你的 `meta` 元素应该是一个空元素，它不应该有结束标签 `</meta>`。

 ```js
 assert.notMatch(code, /<\/meta\s*>?/i);
@@ -18,19 +18,19 @@ CSS 定位可让你设定元素在浏览器中的位置。 它有一个 `positio

 # --hints--

-你的 `.cat-head` 选择器应将 `position` 属性设置为 `static`。 Make sure you add a semicolon.
+你的 `.cat-head` 选择器应将 `position` 属性设置为 `static`。 确保你添加了分号。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.position === 'static')
 ```

-你的 `.cat-head` 选择器应将 `top` 属性设置为 `100px`。 Make sure you add a semicolon.
+你的 `.cat-head` 选择器应将 `top` 属性设置为 `100px`。 确保你添加了分号。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.top === '100px')
 ```

-你的 `.cat-head` 选择器应将 `left` 属性设置为 `100px`。 Make sure you add a semicolon.
+你的 `.cat-head` 选择器应将 `left` 属性设置为 `100px`。 确保你添加了分号。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head')?.left === '100px')
@@ -7,57 +7,57 @@ dashedName: step-22

 # --description--

-Now you will learn a CSS trick to draw triangles.
+现在你将学习一个 CSS 技巧来绘制三角形。

-This will be used to draw ears on the cat.
+这将用于绘制猫耳朵。

-Using a class selector, give the `.cat-right-ear` element `height` and `width` properties set to `100px`. Set the `background-color` to `white`. Set the left and right borders to `35px solid blue`. Set the top and bottom borders to `35px solid red`.
+使用类选择器，将 `.cat-right-ear` 元素的 `height` 和 `width` 属性设置为 `100px`。 将 `background-color` 设置为 `white`。 将左侧和右侧的边框设置为 `35px solid blue`。 将顶部和底部的边框设置为 `35px solid red`。

 # --hints--

-You should have a `.cat-right-ear` selector.
+你应该有一个 `.cat-right-ear` 选择器。

 ```js
 assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head'))
 ```

-Your `.cat-right-ear` selector should have a `height` property set to `100px`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 选择器应将 `height` 属性设置为 `100px`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.height === '100px')
 ```

-Your `.cat-right-ear` selector should have a `width` property set to `100px`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 选择器应将 `width` 属性设置为 `100px`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.width === '100px')
 ```

-Your `.cat-right-ear` selector should have a `background-color` property set to `white`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 选择器应将 `background-color` 属性设置为 `white`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.backgroundColor === 'white')
 ```

-Your `.cat-right-ear` selector should have a `border-left` property set to `35px solid blue`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 选择器应设置一个 `border-left` 属性为 `35px solid blue`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderLeft === '35px solid blue')
 ```

-Your `.cat-right-ear` selector should have a `border-right` property set to `35px solid blue`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 选择器应设置一个 `border-right` 属性为 `35px solid blue`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderRight === '35px solid blue')
 ```

-Your `.cat-right-ear` selector should have a `border-top` property set to `35px solid red`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 选择器应设置一个 `border-top` 属性为 `35px solid red`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderTop === '35px solid red')
 ```

-Your `.cat-right-ear` selector should have a `border-bottom` property set to `35px solid red`. Don't forget to add a semi-colon.
+你的 `.cat-right-ear` 选择器应设置一个 `border-bottom` 属性为 `35px solid red`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderBottom === '35px solid red')
@@ -1,6 +1,6 @@
 ---
 id: 646cecc9eb5c4f4f73dafd07
-title: Step 25
+title: 步骤 25
 challengeType: 0
 dashedName: step-25
 ---
@@ -11,7 +11,7 @@ dashedName: step-25

 # --hints--

-你的 `.cat-left-ear` 选择器应该具有一个 `position` 属性并设置为 `absolute`。 Don't forget to add a semicolon.
+你的 `.cat-left-ear` 选择器应该具有一个 `position` 属性并设置为 `absolute`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.position === 'absolute')
@@ -1,6 +1,6 @@
 ---
 id: 646cef0c2b98915094df7099
-title: Step 26
+title: 步骤 26
 challengeType: 0
 dashedName: step-26
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646cf1206cac5f51804f49cf
-title: Step 27
+title: 步骤 27
 challengeType: 0
 dashedName: step-27
 ---
@@ -15,7 +15,7 @@ dashedName: step-27

 # --hints--

-你应该将你的 `.cat-left-ear` 元素的 `transform` 属性设置为 `rotate(-45deg)`。 Don't forget to add a semicolon.
+你应该将你的 `.cat-left-ear` 元素的 `transform` 属性设置为 `rotate(-45deg)`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.transform === 'rotate(-45deg)')
@@ -1,6 +1,6 @@
 ---
 id: 646cf2249f02ca5233d9af7c
-title: Step 28
+title: 步骤 28
 challengeType: 0
 dashedName: step-28
 ---
@@ -1,6 +1,6 @@
 ---
 id: 646cf48d8f8e1f535a1821d3
-title: Step 29
+title: 步骤 29
 challengeType: 0
 dashedName: step-29
 ---
@@ -11,7 +11,7 @@ dashedName: step-29

 # --hints--

-你的 `.cat-right-ear` 选择器应设置 `position` 属性为 `absolute`。 Don't forget to add a semicolon.
+你的 `.cat-right-ear` 选择器应设置 `position` 属性为 `absolute`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.position === 'absolute')
@@ -1,6 +1,6 @@
 ---
 id: 646cf6cbca98e258da65c979
-title: Step 30
+title: 步骤 30
 challengeType: 0
 dashedName: step-30
 ---
@@ -11,7 +11,7 @@ dashedName: step-30

 # --hints--

-你应该将你的 `.cat-right-ear` 元素的 `transform` 属性设置为 `rotate(45deg)`。 Don't forget to add a semicolon.
+你应该将你的 `.cat-right-ear` 元素的 `transform` 属性设置为 `rotate(45deg)`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.transform === 'rotate(45deg)')
@@ -1,6 +1,6 @@
 ---
 id: 646cf88aa884405a11ea5bcc
-title: Step 31
+title: 步骤 31
 challengeType: 0
 dashedName: step-31
 ---
@@ -11,13 +11,13 @@ dashedName: step-31

 # --hints--

-你的 `.cat-right-ear` 选择器应该设置一个 `border-top-left-radius` 属性值为 `90px`。 Don't forget to add a semicolon.
+你的 `.cat-right-ear` 选择器应该设置一个 `border-top-left-radius` 属性值为 `90px`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderTopLeftRadius === '90px')
 ```

-你的 `.cat-right-ear` 选择器应设置一个 `border-top-right-radius` 属性为 `10px`。 Don't forget to add a semicolon.
+你的 `.cat-right-ear` 选择器应设置一个 `border-top-right-radius` 属性为 `10px`。 不要忘记加上分号。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderTopRightRadius === '10px')
--- a/Show More
+++ b/Show More