mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2026-03-24 11:03:17 -04:00
chore(i18n,learn): processed translations (#55402)
This commit is contained in:
committed by
GitHub
parent
f8fa98ec3a
commit
b236c74844
@@ -7,7 +7,7 @@ dashedName: step-25
|
||||
|
||||
# --description--
|
||||
|
||||
A `while` loop is another kind of loop that runs a portion of code until a specified condition is `True`:
|
||||
A `while` loop is another kind of loop that runs a portion of code as long as a specified condition is `True`. The loop terminates when the condition becomes `False`:
|
||||
|
||||
```py
|
||||
while condition:
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-7
|
||||
|
||||
# --description--
|
||||
|
||||
يمكنك إضافة صور إلى موقع الويب الخاص بك باستخدام عنصر `img`. `img` عناصر تحتوي على opening tag بدون closing tag. الـ tag لعنصر بدون closing tag معروفة باسم <dfn>self-closing tag</dfn>.
|
||||
يمكنك إضافة صور إلى موقع الويب الخاص بك باستخدام عنصر `img`. `img` عناصر تحتوي على opening tag بدون closing tag. A tag for an element without a closing tag is known as a <dfn>void element</dfn>.
|
||||
|
||||
أضف عنصر `img` تحت عنصر `p`. في هذه المرحلة، لن تظهر أي صورة في المتصفح.
|
||||
|
||||
@@ -19,7 +19,7 @@ dashedName: step-7
|
||||
assert(document.querySelector('img'));
|
||||
```
|
||||
|
||||
لا يجب أن يحتوي العنصر `img` على closing tag. Closing tags لها `/` مباشرة بعد رمز `<`.
|
||||
Your `img` element should not have a closing tag `</img>`.
|
||||
|
||||
```js
|
||||
assert(!code.match(/<\/img\>/));
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-37
|
||||
|
||||
# --description--
|
||||
|
||||
عنصر `input` يسمح لك بعدة طرق لجمع البيانات من نموذج الويب. مثل عناصر `img` ،عناصر `input` هي <dfn>self-closing</dfn> ولا تحتاج إلى علامات الإغلاق (closing tags).
|
||||
عنصر `input` يسمح لك بعدة طرق لجمع البيانات من نموذج الويب. Like `img` elements, `input` elements are a <dfn>void element</dfn> and do not need closing tags.
|
||||
|
||||
ادمج عنصر `input` في عنصر `form`.
|
||||
|
||||
|
||||
@@ -15,7 +15,7 @@ Here is an example of a radio button with the option of `cat`:
|
||||
<input type="radio"> cat
|
||||
```
|
||||
|
||||
تذكر أن عناصر `input` هي <dfn>self-closing</dfn>.
|
||||
Remember that an `input` element is a void element.
|
||||
|
||||
قبل الـ text input، أضف زر radio مع الخيار محدد كالتالي:
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-69
|
||||
|
||||
# --description--
|
||||
|
||||
يمكنك تعيين سلوك المتصفح عن طريق إضافة عناصر `meta` ذاتي الأغلاق في `head`. إليك مثال:
|
||||
You can set browser behavior by adding `meta` elements in the `head`. إليك مثال:
|
||||
|
||||
```html
|
||||
<meta attribute="value">
|
||||
@@ -15,13 +15,13 @@ dashedName: step-69
|
||||
|
||||
Inside the `head` element, nest a `meta` element with an attribute named `charset`. Set to the value to `utf-8` which tells the browser how to encode characters for the page.
|
||||
|
||||
Note that `meta` elements are self-closing.
|
||||
Note that the `meta` element is a void element.
|
||||
|
||||
With that last change, you have completed the Cat Photo App project. Congratulations!
|
||||
|
||||
# --hints--
|
||||
|
||||
يجب عليك إنشاء عنصر `meta` ذاتي الأغلاق داخل عنصر `head`.
|
||||
You should create a `meta` element within the `head` element.
|
||||
|
||||
```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');
|
||||
```
|
||||
|
||||
يجب أن يكون عنصرك `meta` علامة ذاتي الأغلاق، لا تحتاج إلى إضافة `</meta>`.
|
||||
Your `meta` element should be a void element, you don't need to add `</meta>`.
|
||||
|
||||
```js
|
||||
assert.notMatch(code, /<\/meta\s*>?/i);
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-4
|
||||
|
||||
# --description--
|
||||
|
||||
أضف عنصر `title` وعنصر `meta` جديد داخل عنصر `head`. أعطِ مشروعك عنوانًا `Registration Form`، وأعط `charset` سمة بقيمة `UTF-8` لعنصرك `meta`.
|
||||
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.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -18,26 +18,37 @@ const title = document.querySelector('title');
|
||||
assert.exists(title);
|
||||
```
|
||||
|
||||
عنصر `title` يجب أن يكون داخل عنصر `head`.
|
||||
Your `title` element should be within the `head` element.
|
||||
|
||||
```js
|
||||
assert.exists(document.querySelector('head > title'));
|
||||
```
|
||||
|
||||
يجب أن يحتوي مشروعك على عنوان `Registration Form`.
|
||||
|
||||
```js
|
||||
const title = document.querySelector('title');
|
||||
assert.equal(title.text.toLowerCase(), 'registration form')
|
||||
```
|
||||
|
||||
تذكر أن الـ casing، اي حالة الحرف سواء كبير او صغير (capital or small) والإملاء مهمان للعنوان.
|
||||
Your project should have a title of `Registration Form`. تذكر أن الـ casing، اي حالة الحرف سواء كبير او صغير (capital or small) والإملاء مهمان للعنوان.
|
||||
|
||||
```js
|
||||
const title = document.querySelector('title');
|
||||
assert.equal(title.text, 'Registration Form');
|
||||
```
|
||||
|
||||
You should create a `meta` element within the `head` element.
|
||||
|
||||
```js
|
||||
assert.exists(document.querySelector('head > meta'));
|
||||
```
|
||||
|
||||
You should give the `meta` element a `charset` attribute with the value of `utf-8`.
|
||||
|
||||
```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>`.
|
||||
|
||||
```js
|
||||
assert.notMatch(code, /<\/meta\s*>?/i);
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
## --seed-contents--
|
||||
|
||||
@@ -7,34 +7,60 @@ dashedName: step-22
|
||||
|
||||
# --description--
|
||||
|
||||
You are going to make each ear look like a triangle.
|
||||
Now you will learn a CSS trick to draw triangles.
|
||||
|
||||
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`.
|
||||
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`.
|
||||
|
||||
# --hints--
|
||||
|
||||
You should have a `.cat-left-ear` selector.
|
||||
|
||||
```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`
|
||||
You should have a `.cat-right-ear` selector.
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderLeft === '35px solid transparent')
|
||||
assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head'))
|
||||
```
|
||||
|
||||
Your `.cat-left-ear` selector should have a `border-right` property set to `35px solid transparent`
|
||||
Your `.cat-right-ear` selector should have a `height` property set to `100px`. Don't forget to add a semi-colon.
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderRight === '35px solid transparent')
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.height === '100px')
|
||||
```
|
||||
|
||||
Your `.cat-left-ear` selector should have a `border-bottom` property set to `70px solid #5e5e5e`
|
||||
Your `.cat-right-ear` selector should have a `width` property set to `100px`. Don't forget to add a semi-colon.
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderBottom === '70px solid rgb(94, 94, 94)')
|
||||
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.
|
||||
|
||||
```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.
|
||||
|
||||
```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.
|
||||
|
||||
```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.
|
||||
|
||||
```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.
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderBottom === '35px solid red')
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cecc9eb5c4f4f73dafd07
|
||||
title: Step 23
|
||||
title: Step 25
|
||||
challengeType: 0
|
||||
dashedName: step-25
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cef0c2b98915094df7099
|
||||
title: Step 24
|
||||
title: Step 26
|
||||
challengeType: 0
|
||||
dashedName: step-26
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf1206cac5f51804f49cf
|
||||
title: Step 25
|
||||
title: Step 27
|
||||
challengeType: 0
|
||||
dashedName: step-27
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf2249f02ca5233d9af7c
|
||||
title: Step 26
|
||||
title: Step 28
|
||||
challengeType: 0
|
||||
dashedName: step-28
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf48d8f8e1f535a1821d3
|
||||
title: Step 27
|
||||
title: Step 29
|
||||
challengeType: 0
|
||||
dashedName: step-29
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf6cbca98e258da65c979
|
||||
title: Step 28
|
||||
title: Step 30
|
||||
challengeType: 0
|
||||
dashedName: step-30
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf88aa884405a11ea5bcc
|
||||
title: Step 29
|
||||
title: Step 31
|
||||
challengeType: 0
|
||||
dashedName: step-31
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cfc2b8e6fe95c20a819d5
|
||||
title: Step 30
|
||||
title: Step 32
|
||||
challengeType: 0
|
||||
dashedName: step-32
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cfd853634255d02b64cc1
|
||||
title: Step 31
|
||||
title: Step 33
|
||||
challengeType: 0
|
||||
dashedName: step-33
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cfde6ac612e5d60391f50
|
||||
title: Step 32
|
||||
title: Step 34
|
||||
challengeType: 0
|
||||
dashedName: step-34
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd556d524bc61c0139bd6
|
||||
title: Step 33
|
||||
title: Step 35
|
||||
challengeType: 0
|
||||
dashedName: step-35
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd6f9caa862627dd87772
|
||||
title: Step 34
|
||||
title: Step 36
|
||||
challengeType: 0
|
||||
dashedName: step-36
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd7cfd0cfac630c1dd520
|
||||
title: Step 35
|
||||
title: Step 37
|
||||
challengeType: 0
|
||||
dashedName: step-37
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd8c79ec23463a3d0e356
|
||||
title: Step 36
|
||||
title: Step 38
|
||||
challengeType: 0
|
||||
dashedName: step-38
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd9d9a729916460724f16
|
||||
title: Step 37
|
||||
title: Step 39
|
||||
challengeType: 0
|
||||
dashedName: step-39
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646ddab8afd73764f5241bbf
|
||||
title: Step 38
|
||||
title: Step 40
|
||||
challengeType: 0
|
||||
dashedName: step-40
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646ddb61ff08366570cc5902
|
||||
title: Step 39
|
||||
title: Step 41
|
||||
challengeType: 0
|
||||
dashedName: step-41
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646ddd3f9f97a0667b964bdb
|
||||
title: Step 40
|
||||
title: Step 42
|
||||
challengeType: 0
|
||||
dashedName: step-42
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dde7dc20dc167489faa69
|
||||
title: Step 41
|
||||
title: Step 43
|
||||
challengeType: 0
|
||||
dashedName: step-43
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646ddf888632fa67f1180940
|
||||
title: Step 42
|
||||
title: Step 44
|
||||
challengeType: 0
|
||||
dashedName: step-44
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de5dc8988076a1d992afd
|
||||
title: Step 43
|
||||
title: Step 45
|
||||
challengeType: 0
|
||||
dashedName: step-45
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de6a97b50a86ac487de86
|
||||
title: Step 44
|
||||
title: Step 46
|
||||
challengeType: 0
|
||||
dashedName: step-46
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de7b64467e96b7d35b5cd
|
||||
title: Step 45
|
||||
title: Step 47
|
||||
challengeType: 0
|
||||
dashedName: step-47
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de8478d6f796bfbdccfb2
|
||||
title: Step 46
|
||||
title: Step 48
|
||||
challengeType: 0
|
||||
dashedName: step-48
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de8d204a3426c7d184372
|
||||
title: Step 47
|
||||
title: Step 49
|
||||
challengeType: 0
|
||||
dashedName: step-49
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dea1c98c2426d43a705c3
|
||||
title: Step 48
|
||||
title: Step 50
|
||||
challengeType: 0
|
||||
dashedName: step-50
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646deb169847f86df0f95bfc
|
||||
title: Step 49
|
||||
title: Step 51
|
||||
challengeType: 0
|
||||
dashedName: step-51
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dec359bef3b7811fba5a6
|
||||
title: Step 50
|
||||
title: Step 52
|
||||
challengeType: 0
|
||||
dashedName: step-52
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dedbcba062079128b2ecc
|
||||
title: Step 51
|
||||
title: Step 53
|
||||
challengeType: 0
|
||||
dashedName: step-53
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646def5e863abf7a14501421
|
||||
title: Step 52
|
||||
title: Step 54
|
||||
challengeType: 0
|
||||
dashedName: step-54
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646df03c8f79337ab46f148b
|
||||
title: Step 53
|
||||
title: Step 55
|
||||
challengeType: 0
|
||||
dashedName: step-55
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646df0cf26413a7b35e4b8b3
|
||||
title: Step 54
|
||||
title: Step 56
|
||||
challengeType: 0
|
||||
dashedName: step-56
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646df1d1aa4ae57bdf1869c4
|
||||
title: Step 55
|
||||
title: Step 57
|
||||
challengeType: 0
|
||||
dashedName: step-57
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dffd8ce9ac77ec1906f2e
|
||||
title: Step 56
|
||||
title: Step 58
|
||||
challengeType: 0
|
||||
dashedName: step-58
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f0417322c0e04983a5149
|
||||
title: Step 59
|
||||
title: Step 61
|
||||
challengeType: 0
|
||||
dashedName: step-61
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f08293804a30685533c6f
|
||||
title: Step 60
|
||||
title: Step 62
|
||||
challengeType: 0
|
||||
dashedName: step-62
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f09293eb3230723a62f77
|
||||
title: Step 61
|
||||
title: Step 63
|
||||
challengeType: 0
|
||||
dashedName: step-63
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f0c9a1e3360092d1bbd33
|
||||
title: Step 62
|
||||
title: Step 64
|
||||
challengeType: 0
|
||||
dashedName: step-64
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f0ce5737243098ad6e494
|
||||
title: Step 63
|
||||
title: Step 65
|
||||
challengeType: 0
|
||||
dashedName: step-65
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f0ef13604420a8744f7d4
|
||||
title: Step 64
|
||||
title: Step 66
|
||||
challengeType: 0
|
||||
dashedName: step-66
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f0f7c5933560af8e7e380
|
||||
title: Step 65
|
||||
title: Step 67
|
||||
challengeType: 0
|
||||
dashedName: step-67
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f102bf87b350b593baa72
|
||||
title: Step 66
|
||||
title: Step 68
|
||||
challengeType: 0
|
||||
dashedName: step-68
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f107abb89d00bb99f387a
|
||||
title: Step 67
|
||||
title: Step 69
|
||||
challengeType: 0
|
||||
dashedName: step-69
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f12da0b4c5d0ca162834a
|
||||
title: Step 69
|
||||
title: Step 71
|
||||
challengeType: 0
|
||||
dashedName: step-71
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f135eab69d90d0c6d4e9b
|
||||
title: Step 70
|
||||
title: Step 72
|
||||
challengeType: 0
|
||||
dashedName: step-72
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f159b2cffb21150b927cb
|
||||
title: Step 71
|
||||
title: Step 73
|
||||
challengeType: 0
|
||||
dashedName: step-73
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f164bf100dd11d226161f
|
||||
title: Step 72
|
||||
title: Step 74
|
||||
challengeType: 0
|
||||
dashedName: step-74
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f1764e2f1d212ba9785a7
|
||||
title: Step 73
|
||||
title: Step 75
|
||||
challengeType: 0
|
||||
dashedName: step-75
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f1802a09a171332e14630
|
||||
title: Step 74
|
||||
title: Step 76
|
||||
challengeType: 0
|
||||
dashedName: step-76
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f4d6c42dc5f214f4e7444
|
||||
title: Step 75
|
||||
title: Step 77
|
||||
challengeType: 0
|
||||
dashedName: step-77
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f4e46e81f7021d5fd9c1d
|
||||
title: Step 76
|
||||
title: Step 78
|
||||
challengeType: 0
|
||||
dashedName: step-78
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f4f6a14e3c522d130a0d2
|
||||
title: Step 77
|
||||
title: Step 79
|
||||
challengeType: 0
|
||||
dashedName: step-79
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f4fe12b7985232bf475a5
|
||||
title: Step 78
|
||||
title: Step 80
|
||||
challengeType: 0
|
||||
dashedName: step-80
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f507e4d1cd323f17db4fc
|
||||
title: Step 79
|
||||
title: Step 81
|
||||
challengeType: 0
|
||||
dashedName: step-81
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646f516dbfc1342495515625
|
||||
title: Step 80
|
||||
title: Step 82
|
||||
challengeType: 0
|
||||
dashedName: step-82
|
||||
---
|
||||
|
||||
@@ -9,7 +9,7 @@ dashedName: step-11
|
||||
|
||||
The next position property is `absolute`. When you use the `absolute` value for your `position` property, the element is taken out of the normal flow of the document, and then its position is determined by the `top`, `right`, `bottom`, and `left` properties.
|
||||
|
||||
Set the position property of your `.cat-head` element to `absolute`, then set `top` and `left` properties to any pixel value.
|
||||
Set the position property of your `.cat-head` element to `absolute`, then set `top` and `left` properties to any positive pixel value.
|
||||
|
||||
<!-- **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`. -->
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 64a2687ef267e5934a2f93e3
|
||||
title: Step 57
|
||||
title: Step 59
|
||||
challengeType: 0
|
||||
dashedName: step-59
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 64a26ac5540c5493f4641f10
|
||||
title: Step 58
|
||||
title: Step 60
|
||||
challengeType: 0
|
||||
dashedName: step-60
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 64a3bcbc83e574b58c8ed048
|
||||
title: Step 68
|
||||
title: Step 70
|
||||
challengeType: 0
|
||||
dashedName: step-70
|
||||
---
|
||||
|
||||
@@ -9,7 +9,7 @@ dashedName: step-74
|
||||
|
||||
The `setPlayButtonAccessibleText` function will set the `aria-label` attribute to the current song, or to the first song in the playlist. And if the playlist is empty, it sets the `aria-label` to `"Play"`.
|
||||
|
||||
Use the `setAttribute` method on the `playButton` element to set an attribute named `"aria-label"`. For the value, use a ternary to set `song?.title` to `Play ${song.title}` or `"Play"` if there's no `song.title` available.
|
||||
Use the `setAttribute` method on the `playButton` element to set an attribute named `"aria-label"`. Using a ternary, set the attribute value to `Play ${song.title}` or `"Play"` if `song?.title` is not available.
|
||||
|
||||
Don't forget you need template interpolation here, so you need to use backticks.
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@ If there is a winner, you will want to show the `resetGameBtn` button and hide t
|
||||
|
||||
**Tips**
|
||||
|
||||
- You can use the `el.style.display` property to show the `resetGameBtn` button and hide the `optionsContainer`.
|
||||
Use the `style.display` property on an element, with the value `"block"` or `"none"`, to show or hide the element.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -33,6 +33,7 @@ if (playerScore === 3) {
|
||||
} else {
|
||||
assert.equal(winnerMsgElement.innerText, "Computer has won the game!");
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
You should hide the `optionsContainer` and if the player or computer has reached three points.
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
---
|
||||
id: 657e0d0037192f3d9e3d5417
|
||||
id: 657e0d0037192f3d9e3d5417
|
||||
title: Task 128
|
||||
challengeType: 22
|
||||
dashedName: task-128
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-25
|
||||
|
||||
# --description--
|
||||
|
||||
A `while` loop is another kind of loop that runs a portion of code until a specified condition is `True`:
|
||||
A `while` loop is another kind of loop that runs a portion of code as long as a specified condition is `True`. The loop terminates when the condition becomes `False`:
|
||||
|
||||
```py
|
||||
while condition:
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-7
|
||||
|
||||
# --description--
|
||||
|
||||
你可以通過使用 `img` 元素來爲你的網站添加圖片。 `img` 元素只有一個開始標籤,沒有結束標籤。 一個沒有結束標籤的元素,它的標籤被稱爲<dfn>自閉合標籤</dfn>。
|
||||
你可以通過使用 `img` 元素來爲你的網站添加圖片。 `img` 元素只有一個開始標籤,沒有結束標籤。 A tag for an element without a closing tag is known as a <dfn>void element</dfn>.
|
||||
|
||||
在 `p` 元素的下方添加一個 `img` 元素。 此時,沒有圖片會出現在瀏覽器中。
|
||||
|
||||
@@ -19,7 +19,7 @@ dashedName: step-7
|
||||
assert(document.querySelector('img'));
|
||||
```
|
||||
|
||||
你的 `img` 應該沒有結束標籤。 結束標籤在 `<` 字符後面要有一個 `/`。
|
||||
Your `img` element should not have a closing tag `</img>`.
|
||||
|
||||
```js
|
||||
assert(!code.match(/<\/img\>/));
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-37
|
||||
|
||||
# --description--
|
||||
|
||||
`input` 元素允許你通過多種方式從 Web 表單中收集數據。 與 `img` 元素一樣,`input` 元素是<dfn>自閉合的</dfn>,並且不需要結束標籤。
|
||||
`input` 元素允許你通過多種方式從 Web 表單中收集數據。 Like `img` elements, `input` elements are a <dfn>void element</dfn> and do not need closing tags.
|
||||
|
||||
在 `form` 元素中嵌套一個 `input` 元素。
|
||||
|
||||
|
||||
@@ -15,7 +15,7 @@ dashedName: step-44
|
||||
<input type="radio"> cat
|
||||
```
|
||||
|
||||
請記住,`input` 元素是<dfn>自閉合的</dfn>。
|
||||
Remember that an `input` element is a void element.
|
||||
|
||||
在文本輸入之前,添加一個具有如下選項的單選按鈕:
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-69
|
||||
|
||||
# --description--
|
||||
|
||||
你可以通過在 `head` 中添加自閉合的 `meta` 元素,來設置瀏覽器行爲。 如下所示:
|
||||
You can set browser behavior by adding `meta` elements in the `head`. 如下所示:
|
||||
|
||||
```html
|
||||
<meta attribute="value">
|
||||
@@ -15,13 +15,13 @@ dashedName: step-69
|
||||
|
||||
在 `head` 元素中,嵌套一個有 `charset` 屬性的 `meta` 元素。 設置屬性值爲 `utf-8`,這告訴瀏覽器本網頁使用什麼字符編碼。
|
||||
|
||||
注意 `meta` 是自閉合元素。
|
||||
Note that the `meta` element is a void element.
|
||||
|
||||
完成最後一項更改後,你就完成了貓咪相冊應用項目。 恭喜!
|
||||
|
||||
# --hints--
|
||||
|
||||
你應該在 `head` 元素中創建一個自閉合的 `meta` 元素。
|
||||
You should create a `meta` element within the `head` element.
|
||||
|
||||
```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');
|
||||
```
|
||||
|
||||
你的 `meta` 元素應該是一個自閉合標籤,你不需要添加 `</meta>`。
|
||||
Your `meta` element should be a void element, you don't need to add `</meta>`.
|
||||
|
||||
```js
|
||||
assert.notMatch(code, /<\/meta\s*>?/i);
|
||||
|
||||
@@ -7,7 +7,7 @@ dashedName: step-4
|
||||
|
||||
# --description--
|
||||
|
||||
給 `head` 添加一個 `title` 和一個 `meta` 元素。 設置項目的標題爲 `Registration Form`,添加一個 `meta` 元素設置其`charset` 屬性的值爲 `UTF-8`。
|
||||
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.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -18,26 +18,37 @@ const title = document.querySelector('title');
|
||||
assert.exists(title);
|
||||
```
|
||||
|
||||
`title` 元素應該在 `head` 元素內。
|
||||
Your `title` element should be within the `head` element.
|
||||
|
||||
```js
|
||||
assert.exists(document.querySelector('head > title'));
|
||||
```
|
||||
|
||||
項目的標題應該爲 `Registration Form`。
|
||||
|
||||
```js
|
||||
const title = document.querySelector('title');
|
||||
assert.equal(title.text.toLowerCase(), 'registration form')
|
||||
```
|
||||
|
||||
記住,標題的大小寫和拼寫很重要。
|
||||
Your project should have a title of `Registration Form`. 記住,標題的大小寫和拼寫很重要。
|
||||
|
||||
```js
|
||||
const title = document.querySelector('title');
|
||||
assert.equal(title.text, 'Registration Form');
|
||||
```
|
||||
|
||||
You should create a `meta` element within the `head` element.
|
||||
|
||||
```js
|
||||
assert.exists(document.querySelector('head > meta'));
|
||||
```
|
||||
|
||||
You should give the `meta` element a `charset` attribute with the value of `utf-8`.
|
||||
|
||||
```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>`.
|
||||
|
||||
```js
|
||||
assert.notMatch(code, /<\/meta\s*>?/i);
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
## --seed-contents--
|
||||
|
||||
@@ -7,34 +7,60 @@ dashedName: step-22
|
||||
|
||||
# --description--
|
||||
|
||||
你將把每隻耳朵畫成一個三角形。
|
||||
Now you will learn a CSS trick to draw triangles.
|
||||
|
||||
使用類選擇器,給 `.cat-left-ear` 元素左右各添加 `35px solid transparent` 的邊框。 另外,把底邊設置爲 `70px solid #5e5e5e`。
|
||||
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`.
|
||||
|
||||
# --hints--
|
||||
|
||||
你應該有一個 `.cat-left-ear` 選擇器。
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear'))
|
||||
```
|
||||
|
||||
你的 `.cat-left-ear` 選擇器應該有一個設置爲 `35px solid transparent` 的 `border-left` 屬性。
|
||||
You should have a `.cat-right-ear` selector.
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderLeft === '35px solid transparent')
|
||||
assert(new __helpers.CSSHelp(document)?.getStyle('.cat-head'))
|
||||
```
|
||||
|
||||
你的 `.cat-left-ear` 選擇器應該有一個設置爲 `35px solid transparent` 的 `border-right` 屬性。
|
||||
Your `.cat-right-ear` selector should have a `height` property set to `100px`. Don't forget to add a semi-colon.
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderRight === '35px solid transparent')
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.height === '100px')
|
||||
```
|
||||
|
||||
你的 `.cat-left-ear` 選擇器應該有一個設置爲 `70px solid #5e5e5e` 的 `border-bottom` 屬性。
|
||||
Your `.cat-right-ear` selector should have a `width` property set to `100px`. Don't forget to add a semi-colon.
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-left-ear')?.borderBottom === '70px solid rgb(94, 94, 94)')
|
||||
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.
|
||||
|
||||
```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.
|
||||
|
||||
```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.
|
||||
|
||||
```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.
|
||||
|
||||
```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.
|
||||
|
||||
```js
|
||||
assert(new __helpers.CSSHelp(document).getStyle('.cat-right-ear')?.borderBottom === '35px solid red')
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cecc9eb5c4f4f73dafd07
|
||||
title: 步驟 23
|
||||
title: Step 25
|
||||
challengeType: 0
|
||||
dashedName: step-25
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cef0c2b98915094df7099
|
||||
title: 步驟 24
|
||||
title: Step 26
|
||||
challengeType: 0
|
||||
dashedName: step-26
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf1206cac5f51804f49cf
|
||||
title: 步驟 25
|
||||
title: Step 27
|
||||
challengeType: 0
|
||||
dashedName: step-27
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf2249f02ca5233d9af7c
|
||||
title: 步驟 26
|
||||
title: Step 28
|
||||
challengeType: 0
|
||||
dashedName: step-28
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf48d8f8e1f535a1821d3
|
||||
title: 步驟 27
|
||||
title: Step 29
|
||||
challengeType: 0
|
||||
dashedName: step-29
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf6cbca98e258da65c979
|
||||
title: 步驟 28
|
||||
title: Step 30
|
||||
challengeType: 0
|
||||
dashedName: step-30
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cf88aa884405a11ea5bcc
|
||||
title: 步驟 29
|
||||
title: Step 31
|
||||
challengeType: 0
|
||||
dashedName: step-31
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cfc2b8e6fe95c20a819d5
|
||||
title: 步驟 30
|
||||
title: Step 32
|
||||
challengeType: 0
|
||||
dashedName: step-32
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cfd853634255d02b64cc1
|
||||
title: 步驟 31
|
||||
title: Step 33
|
||||
challengeType: 0
|
||||
dashedName: step-33
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646cfde6ac612e5d60391f50
|
||||
title: 步驟 32
|
||||
title: Step 34
|
||||
challengeType: 0
|
||||
dashedName: step-34
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd556d524bc61c0139bd6
|
||||
title: 步驟 33
|
||||
title: Step 35
|
||||
challengeType: 0
|
||||
dashedName: step-35
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd6f9caa862627dd87772
|
||||
title: 步驟 34
|
||||
title: Step 36
|
||||
challengeType: 0
|
||||
dashedName: step-36
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd7cfd0cfac630c1dd520
|
||||
title: 步驟 35
|
||||
title: Step 37
|
||||
challengeType: 0
|
||||
dashedName: step-37
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd8c79ec23463a3d0e356
|
||||
title: 步驟 36
|
||||
title: Step 38
|
||||
challengeType: 0
|
||||
dashedName: step-38
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dd9d9a729916460724f16
|
||||
title: 步驟 37
|
||||
title: Step 39
|
||||
challengeType: 0
|
||||
dashedName: step-39
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646ddab8afd73764f5241bbf
|
||||
title: 步驟 38
|
||||
title: Step 40
|
||||
challengeType: 0
|
||||
dashedName: step-40
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646ddb61ff08366570cc5902
|
||||
title: 步驟 39
|
||||
title: Step 41
|
||||
challengeType: 0
|
||||
dashedName: step-41
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646ddd3f9f97a0667b964bdb
|
||||
title: 步驟 40
|
||||
title: Step 42
|
||||
challengeType: 0
|
||||
dashedName: step-42
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646dde7dc20dc167489faa69
|
||||
title: 步驟 41
|
||||
title: Step 43
|
||||
challengeType: 0
|
||||
dashedName: step-43
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646ddf888632fa67f1180940
|
||||
title: 步驟 42
|
||||
title: Step 44
|
||||
challengeType: 0
|
||||
dashedName: step-44
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de5dc8988076a1d992afd
|
||||
title: 步驟 43
|
||||
title: Step 45
|
||||
challengeType: 0
|
||||
dashedName: step-45
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de6a97b50a86ac487de86
|
||||
title: 步驟 44
|
||||
title: Step 46
|
||||
challengeType: 0
|
||||
dashedName: step-46
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de7b64467e96b7d35b5cd
|
||||
title: 步驟 45
|
||||
title: Step 47
|
||||
challengeType: 0
|
||||
dashedName: step-47
|
||||
---
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 646de8478d6f796bfbdccfb2
|
||||
title: 步驟 46
|
||||
title: Step 48
|
||||
challengeType: 0
|
||||
dashedName: step-48
|
||||
---
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user