diff --git a/curriculum/challenges/arabic/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md b/curriculum/challenges/arabic/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md index b15f95ac820..8b6a2b6a92b 100644 --- a/curriculum/challenges/arabic/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md +++ b/curriculum/challenges/arabic/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md @@ -11,7 +11,7 @@ dashedName: serve-an-html-file You can respond to requests with a file using the `res.sendFile(path)` method. You can put it inside the `app.get('/', ...)` route handler. خلف الكواليس، ستضبط تلك الطريقة العناوين المناسبة لترشد متصفحك عن كيفية التعامل مع الملف الذي تريد إرساله، وفقًا لنوعه. Then it will read and send the file. This method needs an absolute file path. We recommend you to use the Node global variable `__dirname` to calculate the path like this: ```js -absolutePath = __dirname + relativePath/file.ext +absolutePath = __dirname + '/relativePath/file.ext' ``` # --instructions-- diff --git a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.md b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.md index 3ae2c2e8459..461fb388bf7 100644 --- a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.md +++ b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.md @@ -9,31 +9,31 @@ dashedName: escape-sequences-in-strings # --description-- -引號不是字符串中唯一可以被轉義(escaped)的字符。 Escape sequences allow you to use characters you may not otherwise be able to use in a string. +引號不是字符串中唯一可以被轉義(escaped)的字符。 轉義字符允許你使用可能無法在字符串中使用的字符。
代碼輸出
\'單引號
\"雙引號
\\反斜槓
\n換行符
\t製表符
\r回車
\b退格
\f換頁符
-*Note that the backslash itself must be escaped in order to display as a backslash.* +*請注意,反斜線本身必須被轉義,才能顯示爲反斜線。* # --instructions-- -Assign the following three lines of text into the single variable `myStr` using escape sequences. +使用轉義字符把下面三行文本賦值給一個變量 `myStr`。
FirstLine
    \SecondLine
ThirdLine
-You will need to use escape sequences to insert special characters correctly. You will also need to follow the spacing as it looks above, with no spaces between escape sequences or words. +你需要使用轉義字符正確地插入特殊字符。 你也需要確保間距與上面文本一致,並且單詞或轉義字符之間沒有空格。 -**Note:** The indentation for `SecondLine` is achieved with the tab escape character, not spaces. +**注意:**`SecondLine` 前面的空白是製表符,而不是空格。 # --hints-- -`myStr` should not contain any spaces +`myStr` 不能包含空格。 ```js assert(!/ /.test(myStr)); ``` -`myStr` should contain the strings `FirstLine`, `SecondLine` and `ThirdLine` (remember case sensitivity) +`myStr` 應包含字符串 `FirstLine`、`SecondLine` 和 `ThirdLine`(記得區分大小寫)。 ```js assert( @@ -41,31 +41,31 @@ assert( ); ``` -`FirstLine` should be followed by the newline character `\n` +`FirstLine` 後面應該是一個換行符 `\n`。 ```js assert(/FirstLine\n/.test(myStr)); ``` -`myStr` should contain a tab character `\t` which follows a newline character +`myStr` 應該包含一個製表符 `\t`,它在換行符後面。 ```js assert(/\n\t/.test(myStr)); ``` -`SecondLine` should be preceded by the backslash character `\` +`SecondLine` 前面應該是反斜槓 `\`。 ```js assert(/\\SecondLine/.test(myStr)); ``` -There should be a newline character between `SecondLine` and `ThirdLine` +`SecondLine` 和 `ThirdLine` 之間應該是換行符。 ```js assert(/SecondLine\nThirdLine/.test(myStr)); ``` -`myStr` should only contain characters shown in the instructions +`myStr` 應該只包含上面要求的字符。 ```js assert(myStr === 'FirstLine\n\t\\SecondLine\nThirdLine'); diff --git a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md index 3225e187683..b1bab47c241 100644 --- a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md +++ b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md @@ -15,13 +15,13 @@ dashedName: finding-a-remainder-in-javascript
 5 % 2 = 1
-5 / 2 = 2 remainder 1
+5 / 2 = 2 餘 1
 2 * 2 = 4
 5 - 4 = 1
 
-**Usage** -In mathematics, a number can be checked to be even or odd by checking the remainder of the division of the number by `2`. Even numbers have a remainder of `0`, while odd numbers a remainder of `1`. +**用法** +在數學中,判斷一個數是奇數還是偶數,只需要判斷這個數除以 `2` 得到的餘數是 0 還是 1。 如果是偶數,餘數是 `0`,而如果是奇數,餘數是 `1`。
 17 % 2 = 1
diff --git a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments.md b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments.md
index f0cac4c8b34..fbf1c2c468c 100644
--- a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments.md
+++ b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments.md
@@ -23,7 +23,7 @@ function testFun(param1, param2) {
 
 # --instructions--
 
-
  1. 創建一個名爲 functionWithArgs 的函數,它可以接收兩個參數,計算參數的和,將結果輸出到控制檯。
  2. 用兩個數字作爲參數調用函數。
+
  1. 創建一個名爲 functionWithArgs 的函數,它可以接收兩個參數,計算參數的和,將結果輸出到控制檯。
  2. 自己指定兩個數字作爲參數,運行函數 functionWithArgs。
# --hints-- diff --git a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values.md b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values.md index e6fb2b3f4ff..2a38d2983a3 100644 --- a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values.md +++ b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values.md @@ -15,7 +15,7 @@ dashedName: understanding-boolean-values # --instructions-- -Modify the `welcomeToBooleans` function so that it returns `true` instead of `false`. +修改 `welcomeToBooleans` 函數,讓它返回 `true` 而不是 `false`。 # --hints-- diff --git a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers.md b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers.md index 2b9667d58a7..f2282728df5 100644 --- a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers.md +++ b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers.md @@ -10,7 +10,7 @@ dashedName: sum-all-odd-fibonacci-numbers 在這道題目中,我們需要寫一個函數,參數爲一個正整數 `num`,返回值爲斐波那契數列中,小於或等於 `num` 的奇數之和。 -The first two numbers in the Fibonacci sequence are 0 and 1. 後面的每個數字由之前兩數相加得出。 The first seven numbers of the Fibonacci sequence are 0, 1, 1, 2, 3, 5 and 8. +斐波那契數列的前兩個數字是 0 和 1。 後面的每個數字由之前兩數相加得出。 斐波那契數列的前七個數字分別爲:0、1、1、2、3、5、8。 比如,`sumFibs(10)` 應該返回 `10`。 因爲斐波那契數列中,比 `10` 小的數字只有 1、1、3、5。 diff --git a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups.md b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups.md index d88b0099eb8..190fa1323eb 100644 --- a/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups.md +++ b/curriculum/challenges/chinese-traditional/02-javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups.md @@ -96,14 +96,14 @@ reRegex.lastIndex = 0; assert(reRegex.test('10 10 10')); ``` -Your regex should not match the string `42\t42\t42`. +你的正則表達式不應匹配字符串 `42\t42\t42`。 ```js reRegex.lastIndex = 0; assert(!reRegex.test('42\t42\t42')); ``` -Your regex should not match the string `42 42 42`. +你的正則表達式不應匹配字符串 `42 42 42`。 ```js reRegex.lastIndex = 0; diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart.md index 8a1b70f35d8..77210c70265 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-bar-chart 完成以下需求,並且通過所有測試。 使用你需要的任何庫或 API。 賦予它你自己的個人風格。 -你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 該任務需要使用 D3 的座標軸屬性生成座標軸,這個屬性會自動生成沿軸的刻度。 通過 D3 測試需要這些刻度,因爲它們的位置被用來確定繪製元素的對齊方式。 你可以在這裏 獲取關於生成座標軸的信息。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),那麼對於動態的內容測試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 項目目前還不支持它們。 +你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 該任務需要使用 D3 的座標軸屬性生成座標軸,這個屬性會自動生成沿軸的刻度。 通過 D3 測試需要這些刻度,因爲它們的位置被用來確定繪製元素的對齊方式。 你可以在這裏 獲取關於生成座標軸的信息。 要求的 DOM 元素在每次測試時都會被查詢。 如果你使用了前端框架(例如 Vue),那麼對於動態的內容測試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 項目目前還不支持它們。 **需求 #1:** 圖表應該包含一個具有 `id="title"` 屬性的標題。 @@ -24,17 +24,17 @@ dashedName: visualize-data-with-a-bar-chart **需求 #5:** 在圖表裏,每個數據點都應該有一個具有 `class="bar"` 屬性的 `rect` 元素來展示數據。 -**User Story #6:** Each `.bar` should have the properties `data-date` and `data-gdp` containing `date` and `GDP` values. +**需求 #6:** 每個 `.bar` 應該具有值爲 `date` 的 `data-date` 屬性以及值爲 `GDP` 的 `data-gdp` 屬性。 -**User Story #7:** The `.bar` elements' `data-date` properties should match the order of the provided data. +**需求 #7:** `.bar` 元素的 `data-date` 屬性應與提供的數據的順序相匹配。 -**User Story #8:** The `.bar` elements' `data-gdp` properties should match the order of the provided data. +**需求 #8:** `.bar` 元素的 `data-gdp` 屬性應與提供的數據的順序相匹配。 -**User Story #9:** Each `.bar` element's height should accurately represent the data's corresponding `GDP`. +**需求 #9:** 每個 `.bar` 元素的高度應準確地表示其數據所對應的 `GDP` 值。 -**User Story #10:** The `data-date` attribute and its corresponding `.bar` element should align with the corresponding value on the x-axis. +**需求 #10:** `data-date` 屬性和它對應的 `.bar` 元素應與 x 軸上的相應的值對齊。 -**User Story #11:** The `data-gdp` attribute and its corresponding `.bar` element should align with the corresponding value on the y-axis. +**需求 #11:** `data-gdp` 屬性和它對應的 `.bar` 元素應與 y 軸上的相應的值對齊。 **需求 #12:** 我可以將鼠標懸停在某個區域上,並查看具有 `id="tooltip"` 屬性的提示框,它會顯示有關該區域的更多信息。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map.md index 5578a8f8236..8e4734be0fe 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-choropleth-map 完成以下需求,並且通過所有測試。 你可以使用你需要的任何庫或 API。 賦予它你自己的個人風格。 -你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),那麼對於動態的內容測試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 項目目前還不支持它們。 +你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 要求的 DOM 元素在每次測試時都會被查詢。 如果你使用了前端框架(例如 Vue),那麼對於動態的內容測試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 項目目前還不支持它們。 **需求 #1:** 等值區域圖包含一個具有 `id="title"` 屬性的標題。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-heat-map.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-heat-map.md index 07be3228e10..3ab0c5f9e69 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-heat-map.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-heat-map.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-heat-map 完成以下需求,並且通過所有測試。 你可以使用你需要的任何庫或 API。 賦予它你自己的個人風格。 -你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),那麼對於動態的內容測試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 項目目前還不支持它們。 +你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 要求的 DOM 元素在每次測試時都會被查詢。 如果你使用了前端框架(例如 Vue),那麼對於動態的內容測試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 項目目前還不支持它們。 **需求 #1:** 熱度圖包含一個具有 `id="title"` 屬性的標題。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph.md index 0a368c19d4b..ff79cad2e5e 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-scatterplot-graph 完成以下需求,並且通過所有測試。 你可以使用你需要的任何庫或 API。 賦予它你自己的個人風格。 -你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 該任務需要使用 D3 的座標軸屬性生成座標軸,這個屬性會自動生成沿軸的刻度。 這些刻度是通過 D3 測試所必需的,因爲它們的位置是用來確定圖表元素的對齊方式。 你可以在這裏 獲取關於生成座標軸的信息。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),因爲內容是動態渲染的,試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 框架目前還不支持它們。 +你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 該任務需要使用 D3 的座標軸屬性生成座標軸,這個屬性會自動生成沿軸的刻度。 這些刻度是通過 D3 測試所必需的,因爲它們的位置是用來確定圖表元素的對齊方式。 你可以在這裏 獲取關於生成座標軸的信息。 要求的 DOM 元素在每次測試時都會被查詢。 如果你使用了前端框架(例如 Vue),因爲內容是動態渲染的,試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 框架目前還不支持它們。 **需求 #1:** 散點圖包含一個具有 `id="title"` 屬性的標題元素。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram.md index d26b5a1e79f..95f561af003 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-treemap-diagram 完成以下需求,並且通過所有測試。 使用你需要的任何庫或 API。 賦予它你自己的個人風格。 -你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 該任務需要使用 D3 的座標軸屬性生成座標軸,這個屬性會自動生成沿軸的刻度。 這些刻度是通過 D3 測試所必需的,因爲它們的位置是用來確定圖表元素的對齊方式。 你可以在這裏 獲取關於生成座標軸的信息。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),那麼對於動態的內容測試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 項目目前還不支持它們。 +你可以使用 HTML、JavaScript、CSS、以及基於 svg 的 D3 可視化庫來完成這個挑戰。 該任務需要使用 D3 的座標軸屬性生成座標軸,這個屬性會自動生成沿軸的刻度。 這些刻度是通過 D3 測試所必需的,因爲它們的位置是用來確定圖表元素的對齊方式。 你可以在這裏 獲取關於生成座標軸的信息。 要求的 DOM 元素在每次測試時都會被查詢。 如果你使用了前端框架(例如 Vue),那麼對於動態的內容測試結果可能不準確。 我們希望最終能夠兼容這些框架,但 D3 項目目前還不支持它們。 **需求 #1:** 矩陣樹圖包含一個具有 `id="title"` 屬性的標題。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.md index c66cc134b7f..e3587d2d71f 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.md @@ -8,7 +8,7 @@ dashedName: add-a-tooltip-to-a-d3-element # --description-- -當用戶在一個對象上懸停時,提示框可以顯示關於這個對象更多的信息。 There are several ways to add a tooltip to a visualization. This challenge uses the SVG `title` element. +當用戶在一個對象上懸停時,提示框可以顯示關於這個對象更多的信息。 有幾種方法可以爲可視化添加一個工具提示。 此挑戰使用 SVG `title` 元素。 `title` 和 `text()` 方法一起給每組動態添加數據。 diff --git a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md index 30c68d92dc9..e6cc0a86daa 100644 --- a/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md +++ b/curriculum/challenges/chinese-traditional/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md @@ -8,7 +8,7 @@ dashedName: change-styles-based-on-data # --description-- -D3 是關於可視化和展示數據的。 如果你想基於數據來改變元素的樣式, For example, you may want to color a data point blue if it has a value less than 20, and red otherwise. You can use a callback function in the `style()` method and include the conditional logic. The callback function uses the `d` parameter to represent the data point: +D3 是關於可視化和展示數據的。 如果你想基於數據來改變元素的樣式, 例如,你想將值小於 20 的數據點設置爲藍色,其餘設置爲紅色。 你可以在 `style()` 方法中使用包含條件邏輯的回調函數。 回調函數以 `d` 作爲參數來表示一個數據點: ```js selection.style("color", (d) => { @@ -16,65 +16,65 @@ selection.style("color", (d) => { }); ``` -The `style()` method is not limited to setting the `color` - it can be used with other CSS properties as well. +`style()` 方法不僅僅可以設置 `color`——它也適用於其他 CSS 屬性。 # --instructions-- -Add the `style()` method to the code in the editor to set the `color` of the `h2` elements conditionally. Write the callback function so if the data value is less than 20, it returns red, otherwise it returns green. +在編輯器中添加 `style()` 方法,根據條件設置 `h2` 元素的 `color` 屬性。 寫一個回調函數,如果數據值小於 20,則返回紅色(red),否則返回綠色(green)。 -**Note:** You can use if-else logic, or the ternary operator. +**注意:** 你可以使用 if-else 邏輯或者三元操作符。 # --hints-- -The first `h2` should have a `color` of red. +第一個 `h2` 的 `color` 應該爲 red。 ```js assert($('h2').eq(0).css('color') == 'rgb(255, 0, 0)'); ``` -The second `h2` should have a `color` of green. +第二個 `h2` 的 `color` 應該爲 green。 ```js assert($('h2').eq(1).css('color') == 'rgb(0, 128, 0)'); ``` -The third `h2` should have a `color` of green. +第三個 `h2` 的 `color` 應該爲 green。 ```js assert($('h2').eq(2).css('color') == 'rgb(0, 128, 0)'); ``` -The fourth `h2` should have a `color` of red. +第四個 `h2` 的 `color` 應該爲 red。 ```js assert($('h2').eq(3).css('color') == 'rgb(255, 0, 0)'); ``` -The fifth `h2` should have a `color` of green. +第五個 `h2` 的 `color` 應該爲 green。 ```js assert($('h2').eq(4).css('color') == 'rgb(0, 128, 0)'); ``` -The sixth `h2` should have a `color` of red. +第六個 `h2` 的 `color` 應該爲 red。 ```js assert($('h2').eq(5).css('color') == 'rgb(255, 0, 0)'); ``` -The seventh `h2` should have a `color` of green. +第七個 `h2` 的 `color` 應該爲 green。 ```js assert($('h2').eq(6).css('color') == 'rgb(0, 128, 0)'); ``` -The eighth `h2` should have a `color` of red. +第八個 `h2` 的 `color` 應該爲 red。 ```js assert($('h2').eq(7).css('color') == 'rgb(255, 0, 0)'); ``` -The ninth `h2` should have a `color` of red. +第九個 `h2` 的 `color` 應該爲 red。 ```js assert($('h2').eq(8).css('color') == 'rgb(255, 0, 0)'); diff --git a/curriculum/challenges/chinese-traditional/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md b/curriculum/challenges/chinese-traditional/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md index 1f89df56770..b28b18d4c16 100644 --- a/curriculum/challenges/chinese-traditional/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md +++ b/curriculum/challenges/chinese-traditional/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md @@ -11,7 +11,7 @@ dashedName: serve-an-html-file 通過 `res.sendFile(path)` 方法給請求響應一個文件, 可以把它放到路由處理 `app.get('/', ...)` 中。 在後臺,這個方法會根據你想發送的文件的類型,設置適當的消息頭信息來告訴瀏覽器如何處理它, 然後讀取併發送文件, 此方法需要文件的絕對路徑。 建議使用 Node. js 的全局變量 `__dirname` 來計算出這個文件的絕對路徑: ```js -absolutePath = __dirname + relativePath/file.ext +absolutePath = __dirname + '/relativePath/file.ext' ``` # --instructions-- diff --git a/curriculum/challenges/chinese-traditional/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.md b/curriculum/challenges/chinese-traditional/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.md index 935a4a1a16c..ed584abf237 100644 --- a/curriculum/challenges/chinese-traditional/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.md +++ b/curriculum/challenges/chinese-traditional/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.md @@ -50,7 +50,7 @@ const { ObjectID } = require('mongodb'); # --hints-- -You should serialize the user object correctly. +你應該正確地序列化用戶對象。 ```js async (getUserInput) => { @@ -70,7 +70,7 @@ async (getUserInput) => { } ``` -You should deserialize the user object correctly. +你應該正確地反序列化用戶對象。 ```js async (getUserInput) => { diff --git a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.md b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.md index bb662ea6e82..b05de87bd86 100644 --- a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.md +++ b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.md @@ -9,31 +9,31 @@ dashedName: escape-sequences-in-strings # --description-- -引号不是字符串中唯一可以被转义(escaped)的字符。 Escape sequences allow you to use characters you may not otherwise be able to use in a string. +引号不是字符串中唯一可以被转义(escaped)的字符。 转义字符允许你使用可能无法在字符串中使用的字符。
代码输出
\'单引号
\"双引号
\\反斜杠
\n换行符
\t制表符
\r回车
\b退格
\f换页符
-*Note that the backslash itself must be escaped in order to display as a backslash.* +*请注意,反斜线本身必须被转义,才能显示为反斜线。* # --instructions-- -Assign the following three lines of text into the single variable `myStr` using escape sequences. +使用转义字符把下面三行文本赋值给一个变量 `myStr`。
FirstLine
    \SecondLine
ThirdLine
-You will need to use escape sequences to insert special characters correctly. You will also need to follow the spacing as it looks above, with no spaces between escape sequences or words. +你需要使用转义字符正确地插入特殊字符。 你也需要确保间距与上面文本一致,并且单词或转义字符之间没有空格。 -**Note:** The indentation for `SecondLine` is achieved with the tab escape character, not spaces. +**注意:**`SecondLine` 前面的空白是制表符,而不是空格。 # --hints-- -`myStr` should not contain any spaces +`myStr` 不能包含空格。 ```js assert(!/ /.test(myStr)); ``` -`myStr` should contain the strings `FirstLine`, `SecondLine` and `ThirdLine` (remember case sensitivity) +`myStr` 应包含字符串 `FirstLine`、`SecondLine` 和 `ThirdLine`(记得区分大小写)。 ```js assert( @@ -41,31 +41,31 @@ assert( ); ``` -`FirstLine` should be followed by the newline character `\n` +`FirstLine` 后面应该是一个换行符 `\n`。 ```js assert(/FirstLine\n/.test(myStr)); ``` -`myStr` should contain a tab character `\t` which follows a newline character +`myStr` 应该包含一个制表符 `\t`,它在换行符后面。 ```js assert(/\n\t/.test(myStr)); ``` -`SecondLine` should be preceded by the backslash character `\` +`SecondLine` 前面应该是反斜杠 `\`。 ```js assert(/\\SecondLine/.test(myStr)); ``` -There should be a newline character between `SecondLine` and `ThirdLine` +`SecondLine` 和 `ThirdLine` 之间应该是换行符。 ```js assert(/SecondLine\nThirdLine/.test(myStr)); ``` -`myStr` should only contain characters shown in the instructions +`myStr` 应该只包含上面要求的字符。 ```js assert(myStr === 'FirstLine\n\t\\SecondLine\nThirdLine'); diff --git a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md index 613b6caf0f8..a1db0551aa5 100644 --- a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md +++ b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript.md @@ -15,13 +15,13 @@ dashedName: finding-a-remainder-in-javascript
 5 % 2 = 1
-5 / 2 = 2 remainder 1
+5 / 2 = 2 余 1
 2 * 2 = 4
 5 - 4 = 1
 
-**Usage** -In mathematics, a number can be checked to be even or odd by checking the remainder of the division of the number by `2`. Even numbers have a remainder of `0`, while odd numbers a remainder of `1`. +**用法** +在数学中,判断一个数是奇数还是偶数,只需要判断这个数除以 `2` 得到的余数是 0 还是 1。 如果是偶数,余数是 `0`,而如果是奇数,余数是 `1`。
 17 % 2 = 1
diff --git a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments.md b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments.md
index fb8ee3bac7b..fd90e86b084 100644
--- a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments.md
+++ b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments.md
@@ -23,7 +23,7 @@ function testFun(param1, param2) {
 
 # --instructions--
 
-
  1. 创建一个名为 functionWithArgs 的函数,它可以接收两个参数,计算参数的和,将结果输出到控制台。
  2. 用两个数字作为参数调用函数。
+
  1. 创建一个名为 functionWithArgs 的函数,它可以接收两个参数,计算参数的和,将结果输出到控制台。
  2. 自己指定两个数字作为参数,运行函数 functionWithArgs。
# --hints-- diff --git a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values.md b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values.md index d8e28054683..0192a663ac6 100644 --- a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values.md +++ b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values.md @@ -15,7 +15,7 @@ dashedName: understanding-boolean-values # --instructions-- -Modify the `welcomeToBooleans` function so that it returns `true` instead of `false`. +修改 `welcomeToBooleans` 函数,让它返回 `true` 而不是 `false`。 # --hints-- diff --git a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers.md b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers.md index d4898e494a3..98ff2e67e5d 100644 --- a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers.md +++ b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers.md @@ -10,7 +10,7 @@ dashedName: sum-all-odd-fibonacci-numbers 在这道题目中,我们需要写一个函数,参数为一个正整数 `num`,返回值为斐波那契数列中,小于或等于 `num` 的奇数之和。 -The first two numbers in the Fibonacci sequence are 0 and 1. 后面的每个数字由之前两数相加得出。 The first seven numbers of the Fibonacci sequence are 0, 1, 1, 2, 3, 5 and 8. +斐波那契数列的前两个数字是 0 和 1。 后面的每个数字由之前两数相加得出。 斐波那契数列的前七个数字分别为:0、1、1、2、3、5、8。 比如,`sumFibs(10)` 应该返回 `10`。 因为斐波那契数列中,比 `10` 小的数字只有 1、1、3、5。 diff --git a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups.md b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups.md index 4b97990a17f..0ab2625dd66 100644 --- a/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups.md +++ b/curriculum/challenges/chinese/02-javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups.md @@ -96,14 +96,14 @@ reRegex.lastIndex = 0; assert(reRegex.test('10 10 10')); ``` -Your regex should not match the string `42\t42\t42`. +你的正则表达式不应匹配字符串 `42\t42\t42`。 ```js reRegex.lastIndex = 0; assert(!reRegex.test('42\t42\t42')); ``` -Your regex should not match the string `42 42 42`. +你的正则表达式不应匹配字符串 `42 42 42`。 ```js reRegex.lastIndex = 0; diff --git a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart.md b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart.md index 6563530aa08..1841c8fa315 100644 --- a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart.md +++ b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-bar-chart 完成以下需求,并且通过所有测试。 使用你需要的任何库或 API。 赋予它你自己的个人风格。 -你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 该任务需要使用 D3 的坐标轴属性生成坐标轴,这个属性会自动生成沿轴的刻度。 通过 D3 测试需要这些刻度,因为它们的位置被用来确定绘制元素的对齐方式。 你可以在这里 获取关于生成坐标轴的信息。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),那么对于动态的内容测试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 项目目前还不支持它们。 +你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 该任务需要使用 D3 的坐标轴属性生成坐标轴,这个属性会自动生成沿轴的刻度。 通过 D3 测试需要这些刻度,因为它们的位置被用来确定绘制元素的对齐方式。 你可以在这里 获取关于生成坐标轴的信息。 要求的 DOM 元素在每次测试时都会被查询。 如果你使用了前端框架(例如 Vue),那么对于动态的内容测试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 项目目前还不支持它们。 **需求 #1:** 图表应该包含一个具有 `id="title"` 属性的标题。 @@ -24,17 +24,17 @@ dashedName: visualize-data-with-a-bar-chart **需求 #5:** 在图表里,每个数据点都应该有一个具有 `class="bar"` 属性的 `rect` 元素来展示数据。 -**User Story #6:** Each `.bar` should have the properties `data-date` and `data-gdp` containing `date` and `GDP` values. +**需求 #6:** 每个 `.bar` 应该具有值为 `date` 的 `data-date` 属性以及值为 `GDP` 的 `data-gdp` 属性。 -**User Story #7:** The `.bar` elements' `data-date` properties should match the order of the provided data. +**需求 #7:** `.bar` 元素的 `data-date` 属性应与提供的数据的顺序相匹配。 -**User Story #8:** The `.bar` elements' `data-gdp` properties should match the order of the provided data. +**需求 #8:** `.bar` 元素的 `data-gdp` 属性应与提供的数据的顺序相匹配。 -**User Story #9:** Each `.bar` element's height should accurately represent the data's corresponding `GDP`. +**需求 #9:** 每个 `.bar` 元素的高度应准确地表示其数据所对应的 `GDP` 值。 -**User Story #10:** The `data-date` attribute and its corresponding `.bar` element should align with the corresponding value on the x-axis. +**需求 #10:** `data-date` 属性和它对应的 `.bar` 元素应与 x 轴上的相应的值对齐。 -**User Story #11:** The `data-gdp` attribute and its corresponding `.bar` element should align with the corresponding value on the y-axis. +**需求 #11:** `data-gdp` 属性和它对应的 `.bar` 元素应与 y 轴上的相应的值对齐。 **需求 #12:** 我可以将鼠标悬停在某个区域上,并查看具有 `id="tooltip"` 属性的提示框,它会显示有关该区域的更多信息。 diff --git a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map.md b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map.md index 4a7333cf3d3..6162d8f11e8 100644 --- a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map.md +++ b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-choropleth-map 完成以下需求,并且通过所有测试。 你可以使用你需要的任何库或 API。 赋予它你自己的个人风格。 -你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),那么对于动态的内容测试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 项目目前还不支持它们。 +你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 要求的 DOM 元素在每次测试时都会被查询。 如果你使用了前端框架(例如 Vue),那么对于动态的内容测试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 项目目前还不支持它们。 **需求 #1:** 等值区域图包含一个具有 `id="title"` 属性的标题。 diff --git a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-heat-map.md b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-heat-map.md index 997a907efb4..ead6794aebe 100644 --- a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-heat-map.md +++ b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-heat-map.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-heat-map 完成以下需求,并且通过所有测试。 你可以使用你需要的任何库或 API。 赋予它你自己的个人风格。 -你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),那么对于动态的内容测试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 项目目前还不支持它们。 +你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 要求的 DOM 元素在每次测试时都会被查询。 如果你使用了前端框架(例如 Vue),那么对于动态的内容测试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 项目目前还不支持它们。 **需求 #1:** 热度图包含一个具有 `id="title"` 属性的标题。 diff --git a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph.md b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph.md index 19bf7b6138d..e081ba43c02 100644 --- a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph.md +++ b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-scatterplot-graph 完成以下需求,并且通过所有测试。 你可以使用你需要的任何库或 API。 赋予它你自己的个人风格。 -你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 该任务需要使用 D3 的坐标轴属性生成坐标轴,这个属性会自动生成沿轴的刻度。 这些刻度是通过 D3 测试所必需的,因为它们的位置是用来确定图表元素的对齐方式。 你可以在这里 获取关于生成坐标轴的信息。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),因为内容是动态渲染的,试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 框架目前还不支持它们。 +你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 该任务需要使用 D3 的坐标轴属性生成坐标轴,这个属性会自动生成沿轴的刻度。 这些刻度是通过 D3 测试所必需的,因为它们的位置是用来确定图表元素的对齐方式。 你可以在这里 获取关于生成坐标轴的信息。 要求的 DOM 元素在每次测试时都会被查询。 如果你使用了前端框架(例如 Vue),因为内容是动态渲染的,试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 框架目前还不支持它们。 **需求 #1:** 散点图包含一个具有 `id="title"` 属性的标题元素。 diff --git a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram.md b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram.md index 1a868aa027d..c4b2bd75e7c 100644 --- a/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram.md +++ b/curriculum/challenges/chinese/04-data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram.md @@ -12,7 +12,7 @@ dashedName: visualize-data-with-a-treemap-diagram 完成以下需求,并且通过所有测试。 使用你需要的任何库或 API。 赋予它你自己的个人风格。 -你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 该任务需要使用 D3 的坐标轴属性生成坐标轴,这个属性会自动生成沿轴的刻度。 这些刻度是通过 D3 测试所必需的,因为它们的位置是用来确定图表元素的对齐方式。 你可以在这里 获取关于生成坐标轴的信息。 Required DOM elements are queried on the moment of each test. 如果你使用了前端框架(例如 Vue),那么对于动态的内容测试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 项目目前还不支持它们。 +你可以使用 HTML、JavaScript、CSS、以及基于 svg 的 D3 可视化库来完成这个挑战。 该任务需要使用 D3 的坐标轴属性生成坐标轴,这个属性会自动生成沿轴的刻度。 这些刻度是通过 D3 测试所必需的,因为它们的位置是用来确定图表元素的对齐方式。 你可以在这里 获取关于生成坐标轴的信息。 要求的 DOM 元素在每次测试时都会被查询。 如果你使用了前端框架(例如 Vue),那么对于动态的内容测试结果可能不准确。 我们希望最终能够兼容这些框架,但 D3 项目目前还不支持它们。 **需求 #1:** 矩阵树图包含一个具有 `id="title"` 属性的标题。 diff --git a/curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.md b/curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.md index 22beb14e15d..28bcc9244e7 100644 --- a/curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.md +++ b/curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element.md @@ -8,7 +8,7 @@ dashedName: add-a-tooltip-to-a-d3-element # --description-- -当用户在一个对象上悬停时,提示框可以显示关于这个对象更多的信息。 There are several ways to add a tooltip to a visualization. This challenge uses the SVG `title` element. +当用户在一个对象上悬停时,提示框可以显示关于这个对象更多的信息。 有几种方法可以为可视化添加一个工具提示。 此挑战使用 SVG `title` 元素。 `title` 和 `text()` 方法一起给每组动态添加数据。 diff --git a/curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md b/curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md index b882ed4474a..08fde9a35ce 100644 --- a/curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md +++ b/curriculum/challenges/chinese/04-data-visualization/data-visualization-with-d3/change-styles-based-on-data.md @@ -8,7 +8,7 @@ dashedName: change-styles-based-on-data # --description-- -D3 是关于可视化和展示数据的。 如果你想基于数据来改变元素的样式, For example, you may want to color a data point blue if it has a value less than 20, and red otherwise. You can use a callback function in the `style()` method and include the conditional logic. The callback function uses the `d` parameter to represent the data point: +D3 是关于可视化和展示数据的。 如果你想基于数据来改变元素的样式, 例如,你想将值小于 20 的数据点设置为蓝色,其余设置为红色。 你可以在 `style()` 方法中使用包含条件逻辑的回调函数。 回调函数以 `d` 作为参数来表示一个数据点: ```js selection.style("color", (d) => { @@ -16,65 +16,65 @@ selection.style("color", (d) => { }); ``` -The `style()` method is not limited to setting the `color` - it can be used with other CSS properties as well. +`style()` 方法不仅仅可以设置 `color`——它也适用于其他 CSS 属性。 # --instructions-- -Add the `style()` method to the code in the editor to set the `color` of the `h2` elements conditionally. Write the callback function so if the data value is less than 20, it returns red, otherwise it returns green. +在编辑器中添加 `style()` 方法,根据条件设置 `h2` 元素的 `color` 属性。 写一个回调函数,如果数据值小于 20,则返回红色(red),否则返回绿色(green)。 -**Note:** You can use if-else logic, or the ternary operator. +**注意:** 你可以使用 if-else 逻辑或者三元操作符。 # --hints-- -The first `h2` should have a `color` of red. +第一个 `h2` 的 `color` 应该为 red。 ```js assert($('h2').eq(0).css('color') == 'rgb(255, 0, 0)'); ``` -The second `h2` should have a `color` of green. +第二个 `h2` 的 `color` 应该为 green。 ```js assert($('h2').eq(1).css('color') == 'rgb(0, 128, 0)'); ``` -The third `h2` should have a `color` of green. +第三个 `h2` 的 `color` 应该为 green。 ```js assert($('h2').eq(2).css('color') == 'rgb(0, 128, 0)'); ``` -The fourth `h2` should have a `color` of red. +第四个 `h2` 的 `color` 应该为 red。 ```js assert($('h2').eq(3).css('color') == 'rgb(255, 0, 0)'); ``` -The fifth `h2` should have a `color` of green. +第五个 `h2` 的 `color` 应该为 green。 ```js assert($('h2').eq(4).css('color') == 'rgb(0, 128, 0)'); ``` -The sixth `h2` should have a `color` of red. +第六个 `h2` 的 `color` 应该为 red。 ```js assert($('h2').eq(5).css('color') == 'rgb(255, 0, 0)'); ``` -The seventh `h2` should have a `color` of green. +第七个 `h2` 的 `color` 应该为 green。 ```js assert($('h2').eq(6).css('color') == 'rgb(0, 128, 0)'); ``` -The eighth `h2` should have a `color` of red. +第八个 `h2` 的 `color` 应该为 red。 ```js assert($('h2').eq(7).css('color') == 'rgb(255, 0, 0)'); ``` -The ninth `h2` should have a `color` of red. +第九个 `h2` 的 `color` 应该为 red。 ```js assert($('h2').eq(8).css('color') == 'rgb(255, 0, 0)'); diff --git a/curriculum/challenges/chinese/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md b/curriculum/challenges/chinese/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md index f0b8ce51248..90d9428333f 100644 --- a/curriculum/challenges/chinese/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md +++ b/curriculum/challenges/chinese/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md @@ -11,7 +11,7 @@ dashedName: serve-an-html-file 通过 `res.sendFile(path)` 方法给请求响应一个文件, 可以把它放到路由处理 `app.get('/', ...)` 中。 在后台,这个方法会根据你想发送的文件的类型,设置适当的消息头信息来告诉浏览器如何处理它, 然后读取并发送文件, 此方法需要文件的绝对路径。 建议使用 Node. js 的全局变量 `__dirname` 来计算出这个文件的绝对路径: ```js -absolutePath = __dirname + relativePath/file.ext +absolutePath = __dirname + '/relativePath/file.ext' ``` # --instructions-- diff --git a/curriculum/challenges/chinese/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.md b/curriculum/challenges/chinese/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.md index 03b72c2d982..d197f932a45 100644 --- a/curriculum/challenges/chinese/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.md +++ b/curriculum/challenges/chinese/06-quality-assurance/advanced-node-and-express/serialization-of-a-user-object.md @@ -50,7 +50,7 @@ const { ObjectID } = require('mongodb'); # --hints-- -You should serialize the user object correctly. +你应该正确地序列化用户对象。 ```js async (getUserInput) => { @@ -70,7 +70,7 @@ async (getUserInput) => { } ``` -You should deserialize the user object correctly. +你应该正确地反序列化用户对象。 ```js async (getUserInput) => { diff --git a/curriculum/challenges/espanol/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md b/curriculum/challenges/espanol/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md index 4d33c4b6dfe..e24fb5617a7 100644 --- a/curriculum/challenges/espanol/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md +++ b/curriculum/challenges/espanol/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md @@ -11,7 +11,7 @@ dashedName: serve-an-html-file Puedes responder a peticiones con un archivo utilizando el método `res.sendFile(path)`. Puedes ponerlo dentro del gestor de rutas `app.get('/', ...)`. En segundo plano, este método establecerá las cabeceras apropiadas para indicar a tu navegador cómo manejar el archivo que se desea enviar, de acuerdo a su tipo. Entonces leerá y enviará el archivo. Este método necesita una ruta de archivo absoluta. Te recomendamos que uses la variable global de Node `__dirname` para calcular la ruta como esta: ```js -absolutePath = __dirname + relativePath/file.ext +absolutePath = __dirname + '/relativePath/file.ext' ``` # --instructions-- diff --git a/curriculum/challenges/german/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md b/curriculum/challenges/german/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md index 7c178762e85..c59227e2be6 100644 --- a/curriculum/challenges/german/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md +++ b/curriculum/challenges/german/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md @@ -11,7 +11,7 @@ dashedName: serve-an-html-file Du kannst auf Anfragen mit einer Datei antworten, indem du die Methode `res.sendFile(path)` verwendest. Du kannst sie im `app.get('/', ...)`-Route-Handler einfügen. Im Hintergrund setzt diese Methode die jeweiligen Header, um deinem Browser mitzuteilen, wie er die von dir gesendete Datei je nach Typ zu verarbeiten hat. Dann wird die Datei gelesen und gesendet. Diese Methode benötigt einen absoluten Dateipfad. Wir empfehlen dir, die globale Node-Variable `__dirname` zu verwenden, um den Pfad wie folgt zu berechnen: ```js -absolutePath = __dirname + relativePath/file.ext +absolutePath = __dirname + '/relativePath/file.ext' ``` # --instructions-- diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-459-flipping-game.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-459-flipping-game.md index 13473d922bf..95e84aec7d2 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-459-flipping-game.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-459-flipping-game.md @@ -1,6 +1,6 @@ --- id: 5900f5371000cf542c51004a -title: 'Problem 459: Flipping game' +title: 'Problem 459: Flip-Spiel' challengeType: 1 forumTopicId: 302133 dashedName: problem-459-flipping-game @@ -8,35 +8,35 @@ dashedName: problem-459-flipping-game # --description-- -The flipping game is a two player game played on a $N$ by $N$ square board. +Das Hüpfspiel ist ein Spiel für zwei Spieler, das auf einem quadratischen Spielbrett von $N$ mal $N$ gespielt wird. -Each square contains a disk with one side white and one side black. +Jedes Quadrat enthält eine Scheibe, die auf einer Seite weiß und auf der anderen Seite schwarz ist. -The game starts with all disks showing their white side. +Das Spiel beginnt damit, dass alle Scheiben ihre weiße Seite zeigen. -A turn consists of flipping all disks in a rectangle with the following properties: +Ein Zug besteht darin, alle Scheiben in einem Rechteck mit den folgenden Eigenschaften umzudrehen: -- the upper right corner of the rectangle contains a white disk -- the rectangle width is a perfect square (1, 4, 9, 16, ...) -- the rectangle height is a triangular number (1, 3, 6, 10, ...) +- die obere rechte Ecke des Rechtecks enthält eine weiße Scheibe +- die Rechteckbreite ist ein perfektes Quadrat (1, 4, 9, 16, ...) +- die Höhe des Rechtecks ist eine dreieckige Zahl (1, 3, 6, 10, ...) -flipping all disks in a 4x3 rectangle on a 5x5 board +alle Scheiben in einem 4x3-Rechteck auf einem 5x5-Brett umdrehen -Players alternate turns. A player wins by turning the grid all black. +Spieler wechseln sich ab. Ein Spieler gewinnt, indem er das Raster ganz schwarz macht. -Let $W(N)$ be the number of winning moves for the first player on a $N$ by $N$ board with all disks white, assuming perfect play. +Lasse $W(N)$ die Anzahl der Gewinnzüge für den ersten Spieler auf einem $N$ mal $N$ Brett mit allen weißen Feldern sein, unter der Annahme eines perfekten Spiels. $W(1) = 1$, $W(2) = 0$, $W(5) = 8$ and $W({10}^2) = 31\\,395$. -For $N = 5$, the first player's eight winning first moves are: +Für $N = 5$ sind die acht siegreichen ersten Züge des ersten Spielers: -eight winning first moves for N = 5 +acht gewinnende erste Züge für N = 5 -Find $W({10}^6)$. +Finde $W({10}^6)$. # --hints-- -`flippingGame()` should return `3996390106631`. +`flippingGame()` sollte `3996390106631` zurückgeben. ```js assert.strictEqual(flippingGame(), 3996390106631); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-460-an-ant-on-the-move.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-460-an-ant-on-the-move.md index 2bb68f203f4..41e8c82c3d1 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-460-an-ant-on-the-move.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-460-an-ant-on-the-move.md @@ -1,6 +1,6 @@ --- id: 5900f5381000cf542c51004b -title: 'Problem 460: An ant on the move' +title: 'Problem 460: Ein Ameise auf dem Weg' challengeType: 1 forumTopicId: 302135 dashedName: problem-460-an-ant-on-the-move @@ -8,30 +8,30 @@ dashedName: problem-460-an-ant-on-the-move # --description-- -On the Euclidean plane, an ant travels from point $A(0, 1)$ to point $B(d, 1)$ for an integer $d$. +Auf der euklidischen Ebene reist eine Ameise vom Punkt $A(0, 1)$ zum Punkt $B(d, 1)$ mit dem Integer $d$. -In each step, the ant at point ($x_0$, $y_0$) chooses one of the lattice points ($x_1$, $y_1$) which satisfy $x_1 ≥ 0$ and $y_1 ≥ 1$ and goes straight to ($x_1$, $y_1$) at a constant velocity $v$. The value of $v$ depends on $y_0$ and $y_1$ as follows: +In jedem Schritt wählt die Ameise am Punkt ($x_0$, $y_0$) einen der Gitterpunkte ($x_1$, $y_1$), die die Bedingungen $x_1 ≥ 0$ und $y_1 ≥ 1$ erfüllen, und läuft mit einer konstanten Geschwindigkeit $v$ direkt zu ($x_1$, $y_1$). Der Wert von $v$ hängt von $y_0$ und $y_1$ wie folgt ab: -- If $y_0 = y_1$, the value of $v$ equals $y_0$. -- If $y_0 ≠ y_1$, the value of $v$ equals $\frac{y_1 - y_0}{\ln y_1 - \ln y_0}$. +- Wenn $y_0 = y_1$, ist der Wert von $v$ gleich $y_0$. +- Wenn $y_0 ≠ y_1$, ist der Wert von $v$ gleich $\frac{y_1 - y_0}{\ln y_1 - \ln y_0}$. -The left image is one of the possible paths for $d = 4$. First the ant goes from $A(0, 1)$ to $P_1(1, 3)$ at velocity $\frac{3 - 1}{\ln 3 - \ln 1} ≈ 1.8205$. Then the required time is $\frac{\sqrt{5}}{1.820} ≈ 1.2283$. +Das linke Bild ist einer der möglichen Pfade für $d = 4$. Zunächst bewegt sich die Ameise von $A(0, 1)$ nach $P_1(1, 3)$ mit der Geschwindigkeit $\frac{3 - 1}{\ln 3 - \ln 1} ≈ 1,8205$. Dann ist die benötigte Zeit $\frac{\sqrt{5}}{1.820} ≈ 1.2283$. -From $P_1(1, 3)$ to $P_2(3, 3)$ the ant travels at velocity 3 so the required time is $\frac{2}{3} ≈ 0.6667$. From $P_2(3, 3)$ to $B(4, 1)$ the ant travels at velocity $\frac{1 - 3}{\ln 1 - \ln 3} ≈ 1.8205$ so the required time is $\frac{\sqrt{5}}{1.8205} ≈ 1.2283$. +Von $P_1(1, 3)$ bis $P_2(3, 3)$ bewegt sich die Ameise mit der Geschwindigkeit 3, so dass die benötigte Zeit $\frac{2}{3} ≈ 0,6667$ beträgt. Von $P_2(3, 3)$ nach $B(4, 1)$ bewegt sich die Ameise mit der Geschwindigkeit $\frac{1 - 3}{\ln 1 - \ln 3} ≈ 1,8205$, so dass die benötigte Zeit $\frac{\sqrt{5}}{1,8205} ≈ 1,2283$ beträgt. -Thus the total required time is $1.2283 + 0.6667 + 1.2283 = 3.1233$. +Die benötigte Gesamtzeit beträgt also $1,2283 + 0,6667 + 1,2283 = 3,1233$. -The right image is another path. The total required time is calculated as $0.98026 + 1 + 0.98026 = 2.96052$. It can be shown that this is the quickest path for $d = 4$. +Das rechte Bild ist ein anderer Pfad. Die benötigte Gesamtzeit errechnet sich aus $0.98026 + 1 + 0.98026 = 2.96052$. Man kann zeigen, dass dies der schnellste Weg für $d = 4$ ist. -two possible paths for d = 4 +zwei mögliche Wege für d = 4 -Let $F(d)$ be the total required time if the ant chooses the quickest path. For example, $F(4) ≈ 2.960\\,516\\,287$. We can verify that $F(10) ≈ 4.668\\,187\\,834$ and $F(100) ≈ 9.217\\,221\\,972$. +Lasse $F(d)$ die insgesamt benötigte Zeit sein, wenn die Ameise den schnellsten Weg wählt. Zum Beispiel: $F(4) ≈ 2,960\\,516\,287$. Wir können nachweisen, dass $F(10) ≈ 4,668\\,187\,834$ und $F(100) ≈ 9,217\\,221\,972$. -Find $F(10\\,000)$. Give your answer rounded to nine decimal places. +Finde $F(10\\,000)$. Gib deine Antwort auf neun Dezimalstellen gerundet an. # --hints-- -`antOnTheMove()` should return `18.420738199`. +`antOnTheMove()` sollte `18.420738199` zurückgeben. ```js assert.strictEqual(antOnTheMove(), 18.420738199); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-461-almost-pi.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-461-almost-pi.md index 1ff7e49ee6b..56a59115a7f 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-461-almost-pi.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-461-almost-pi.md @@ -1,6 +1,6 @@ --- id: 5900f53a1000cf542c51004c -title: 'Problem 461: Almost Pi' +title: 'Problem 461: Fast Pi' challengeType: 1 forumTopicId: 302136 dashedName: problem-461-almost-pi @@ -8,43 +8,43 @@ dashedName: problem-461-almost-pi # --description-- -Let `f(k, n)` = $e^\frac{k}{n} - 1$, for all non-negative integers `k`. +Lass `f(k, n)` = $e^\frac{k}{n} - 1$, für alle nicht negativen Integer `k`. -Remarkably, `f(6, 200) + f(75, 200) + f(89, 200) + f(226, 200)` = 3.1415926… ≈ π. +Bemerkenswert,`f(6, 200) + f(75, 200) + f(89, 200) + f(226, 200)` = 3.1415926… ≈ π. -In fact, it is the best approximation of π of the form `f(a, 200) + f(b, 200) + f(c, 200) + f(d, 200)`. +Tatsächlich ist es die beste Annäherung von π der Formel `f(a, 200) + f(b, 200) + f(c, 200) + f(d, 200)`. -Let `almostPi(n)` = a2 + b2 + c2 + d2 for a, b, c, d that minimize the error: $\lvert f(a,n) + f(b,n) + f(c,n) + f(d,n) - \Pi\rvert$ +Lass `almostPi(n)` = a2 + b2 + c2 + d2 für a, b, c, d, das den Fehler minimiert: $\lvert f(a,n) + f(b,n) + f(c,n) + f(d,n) - \Pi\rvert$ -You are given `almostPi(200)` = 62 + 752 + 892 + 2262 = 64658. +Dir wird `almostPi(200)` = 62 + 752 + 892 + 2262 = 64658 gegeben. # --hints-- -`almostPi` should be a function. +`almostPi` sollte eine Funktion sein. ```js assert(typeof almostPi === 'function') ``` -`almostPi` should return a number. +`almostPi` sollte eine Zahl zurückgeben. ```js assert.strictEqual(typeof almostPi(10), 'number'); ``` -`almostPi(29)` should return `1208`. +`almostPi(29)` sollte `1208` zurückgeben. ```js assert.strictEqual(almostPi(29), 1208); ``` -`almostPi(50)` should return `4152`. +`almostPi(50)` sollte `4152` zurückgeben. ```js assert.strictEqual(almostPi(50), 4152); ``` -`almostPi(200)` should return `64658`. +`almostPi(200)` sollte `64658` zurückgeben. ```js assert.strictEqual(almostPi(200), 64658); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers.md index b17dc1befcd..f764bd84993 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers.md @@ -1,6 +1,6 @@ --- id: 5900f53b1000cf542c51004d -title: 'Problem 462: Permutation of 3-smooth numbers' +title: 'Problematik 462: Permutation von 3 gleichmäßigen Zahlen' challengeType: 1 forumTopicId: 302137 dashedName: problem-462-permutation-of-3-smooth-numbers @@ -8,31 +8,31 @@ dashedName: problem-462-permutation-of-3-smooth-numbers # --description-- -A 3-smooth number is an integer which has no prime factor larger than 3. For an integer $N$, we define $S(N)$ as the set of 3-smooth numbers less than or equal to $N$. For example, $S(20) = \\{1, 2, 3, 4, 6, 8, 9, 12, 16, 18\\}$. +Eine glatte 3er-Zahl ist eine ganze Zahl, die keinen Primfaktor größer als 3 hat. Für einen Integer $N$ definieren wir $S(N)$ als die Menge der 3 glatten Zahlen kleiner oder gleich $N$. Zum Beispiel: $S(20) = \\{1, 2, 3, 4, 6, 8, 9, 12, 16, 18\\}$. -We define $F(N)$ as the number of permutations of $S(N)$ in which each element comes after all of its proper divisors. +Wir definieren $F(N)$ als die Anzahl der Permutationen von $S(N)$, in denen jedes Element nach allen seinen eigenen Teilern kommt. -This is one of the possible permutations for $N = 20$. +Dies ist eine der möglichen Permutationen für $N = 20$. - 1, 2, 4, 3, 9, 8, 16, 6, 18, 12. -This is not a valid permutation because 12 comes before its divisor 6. +Dies ist keine gültige Permutation, da 12 vor ihrem Teiler 6 steht. - 1, 2, 4, 3, 9, 8, 12, 16, 6, 18. -We can verify that $F(6) = 5$, $F(8) = 9$, $F(20) = 450$ and $F(1000) ≈ 8.8521816557e\\,21$. +Wir können überprüfen, dass $F(6) = 5$, $F(8) = 9$, $F(20) = 450$ und $F(1000) ≈ 8,8521816557e\\,21$. -Find $F({10}^{18})$. Give as your answer as a string in its scientific notation rounded to ten digits after the decimal point. When giving your answer, use a lowercase `e` to separate mantissa and exponent. E.g. if the answer is $112\\,233\\,445\\,566\\,778\\,899$ then the answer format would be `1.1223344557e17`. +Finde $F({10}^{18})$. Gib deine Antwort als String in wissenschaftlicher Notation an, gerundet auf zehn Stellen nach dem Komma. Wenn du deine Antwort gibst, benutze ein kleingeschriebenes `e`, um Mantisse und Exponent zu trennen. Z.B. wenn die Antwort $112\\,233\\,445\\,566\\,778\\,899$ lautet, würde das Antwortformat `1.1223344557e17` lauten. # --hints-- -`permutationOf3SmoothNumbers()` should return a string. +`permutationOf3SmoothNumbers()` sollte einen String zurückgeben. ```js assert.strictEqual(typeof permutationOf3SmoothNumbers() === 'string'); ``` -`permutationOf3SmoothNumbers()` should return the string `5.5350769703e1512`. +`permutationOf3SmoothNumbers()` sollte den String `5.5350769703e1512` zurückgeben. ```js assert.strictEqual(permutationOf3SmoothNumbers(), '5.5350769703e1512'); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation.md index a8e3607195e..feb7f81ab78 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation.md @@ -1,6 +1,6 @@ --- id: 5900f53c1000cf542c51004e -title: 'Problem 463: A weird recurrence relation' +title: 'Problem 463: Eine merkwürdige Wiederholungsrelation' challengeType: 1 forumTopicId: 302138 dashedName: problem-463-a-weird-recurrence-relation @@ -8,21 +8,21 @@ dashedName: problem-463-a-weird-recurrence-relation # --description-- -The function $f$ is defined for all positive integers as follows: +Die Funktion $f$ ist für alle positive Integer wie folgt definiert: $$\begin{align} & f(1) = 1 \\\\ & f(3) = 3 \\\\ & f(2n) = f(n) \\\\ & f(4n + 1) = 2f(2n + 1) - f(n) \\\\ & f(4n + 3) = 3f(2n + 1) - 2f(n) \end{align}$$ -The function $S(n)$ is defined as $\sum_{i=1}^{n} f(i)$. +Die Funktion $S(n)$ ist als $\sum_{i=1}^{n} f(i)$ definiert. -$S(8) = 22$ and $S(100) = 3604$. +$S(8) = 22$ und $S(100) = 3604$. -Find $S(3^{37})$. Give the last 9 digits of your answer. +Finde $S(3^{37})$. Gib die letzten 9 Ziffern deiner Antwort an. # --hints-- -`weirdRecurrenceRelation()` should return `808981553`. +`weirdRecurrenceRelation()` sollte `808981553` zurückgeben. ```js assert.strictEqual(weirdRecurrenceRelation(), 808981553); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals.md index d293fcda274..ee3cf9bb261 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals.md @@ -1,6 +1,6 @@ --- id: 5900f53d1000cf542c51004f -title: 'Problem 464: Möbius function and intervals' +title: 'Problem 464: Möbius-Funktion und Intervalle' challengeType: 1 forumTopicId: 302139 dashedName: problem-464-mbius-function-and-intervals @@ -8,30 +8,30 @@ dashedName: problem-464-mbius-function-and-intervals # --description-- -The Möbius function, denoted $μ(n)$, is defined as: +Die Möbius-Funktion, bezeichnet mit $μ(n)$, ist definiert als: -- $μ(n) = (-1)^{ω(n)}$ if $n$ is squarefree (where $ω(n)$ is the number of distinct prime factors of $n$) -- $μ(n) = 0$ if $n$ is not squarefree. +- $μ(n) = (-1)^{ω(n)}$ falls $n$ eckfrei ist (wobei $ω(n)$ die Nummer verschiedener Hauptfaktoren von $n$ ist) +- $μ(n) = 0$ falls $n$ nicht eckfrei ist. -Let $P(a, b)$ be the number of integers $n$ in the interval $[a, b]$ such that $μ(n) = 1$. +Lasse $P(a, b)$ die Anzahl der Integer $n$ im Intervall $[a, b]$ sein, so dass $μ(n) = 1$ gilt. -Let $N(a, b)$ be the number of integers $n$ in the interval $[a, b]$ such that $μ(n) = -1$. +Lasse $N(a, b)$ die Anzahl der Integer $n$ im Intervall $[a, b]$ sein, so dass $μ(n) = -1$. -For example, $P(2, 10) = 2$ and $N(2, 10) = 4$. +Zum Beispiel $P(2, 10) = 2$ und $N(2, 10) = 4$. -Let $C(n)$ be the number of integer pairs $(a, b)$ such that: +Lasse $C(n)$ die Anzahl an Paaren der Integer $(a, b)$ sein, so dass: - $1 ≤ a ≤ b ≤ n$, -- $99 \times N(a, b) ≤ 100 \times P(a, b)$, and +- $99 \times N(a, b) ≤ 100 \times P(a, b)$, und - $99 \times P(a, b) ≤ 100 \times N(a, b)$. -For example, $C(10) = 13$, $C(500) = 16\\,676$ and $C(10\\,000) = 20\\,155\\,319$. +Zum Beispiel $C(10) = 13$, $C(500) = 16\\,676$ und $C(10\\,000) = 20\\,155\\,319$. -Find $C(20\\,000\\,000)$. +Finde $C(20\\,000\\,000)$. # --hints-- -`mobiusFunctionAndIntervals()` should return `198775297232878`. +`mobiusFunctionAndIntervals()` sollte `198775297232878` zurückgeben. ```js assert.strictEqual(mobiusFunctionAndIntervals(), 198775297232878); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-465-polar-polygons.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-465-polar-polygons.md index 57ad5b291d6..4e3f32b5835 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-465-polar-polygons.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-465-polar-polygons.md @@ -1,6 +1,6 @@ --- id: 5900f53d1000cf542c510050 -title: 'Problem 465: Polar polygons' +title: 'Problem 465: Polare Polygone' challengeType: 1 forumTopicId: 302140 dashedName: problem-465-polar-polygons @@ -8,27 +8,27 @@ dashedName: problem-465-polar-polygons # --description-- -The kernel of a polygon is defined by the set of points from which the entire polygon's boundary is visible. We define a polar polygon as a polygon for which the origin is strictly contained inside its kernel. +Der Kern eines Polygons wird durch die Menge der Punkte definiert, von denen aus der gesamte Rand des Polygons sichtbar ist. Wir definieren ein polares Polygon als ein Polygon, bei dem der Ursprung genau in seinem Kern enthalten ist. -For this problem, a polygon can have collinear consecutive vertices. However, a polygon still cannot have self-intersection and cannot have zero area. +Bei diesem Problem kann ein Polygon kollinear aufeinanderfolgende Scheitelpunkte haben. Ein Polygon kann sich jedoch weder selbst schneiden noch eine Fläche von Null haben. -For example, only the first of the following is a polar polygon (the kernels of the second, third, and fourth do not strictly contain the origin, and the fifth does not have a kernel at all): +Zum Beispiel ist nur die erste der folgenden Abbildungen ein polares Polygon (die Kerne der zweiten, dritten und vierten enthalten nicht unbedingt den Ursprung und die fünfte hat überhaupt keinen Kern): -five example polygons +fünf Beispielpolygone -Notice that the first polygon has three consecutive collinear vertices. +Beachte, dass das erste Polygon drei aufeinanderfolgende kollineare Scheitelpunkte hat. -Let $P(n)$ be the number of polar polygons such that the vertices $(x, y)$ have integer coordinates whose absolute values are not greater than $n$. +Lasse $P(n)$ die Anzahl der polaren Vielecke sein, bei denen die Eckpunkte $(x, y)$ ganzzahlige Koordinaten haben, deren Absolutwerte nicht größer als $n$ sind. -Note that polygons should be counted as different if they have different set of edges, even if they enclose the same area. For example, the polygon with vertices [(0,0), (0,3), (1,1), (3,0)] is distinct from the polygon with vertices [(0,0), (0,3), (1,1), (3,0), (1,0)]. +Beachte, dass Polygone als unterschiedlich gezählt werden sollten, wenn sie unterschiedliche Kanten haben, auch wenn sie dieselbe Fläche umschließen. So unterscheidet sich beispielsweise das Polygon mit den Eckpunkten [(0,0), (0,3), (1,1), (3,0)] von dem Polygon mit den Eckpunkten [(0,0), (0,3), (1,1), (3,0), (1,0)]. -For example, $P(1) = 131$, $P(2) = 1\\,648\\,531$, $P(3) = 1\\,099\\,461\\,296\\,175$ and $P(343)\bmod 1\\,000\\,000\\,007 = 937\\,293\\,740$. +Zum Beispiel $P(1) = 131$, $P(2) = 1\\,648\\,531$, $P(3) = 1\\,099\\,461\\,296\\,175$ und $P(343)\bmod 1\\,000\\,000\\,007 = 937\\,293\\,740$. -Find $P(7^{13})\bmod 1\\,000\\,000\\,007$. +Finde $P(7^{13})\bmod 1\\,000\\,000\\,007$. # --hints-- -`polarPolygons()` should return `585965659`. +`polarPolygons()` sollte `585965659` zurückgeben. ```js assert.strictEqual(polarPolygons(), 585965659); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table.md index cfefe6e7b9f..5d7b9a6ded3 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table.md @@ -1,6 +1,6 @@ --- id: 5900f53e1000cf542c510051 -title: 'Problem 466: Distinct terms in a multiplication table' +title: 'Problem 466: Verschiedene Begriffe in einer Multiplikationstabelle' challengeType: 1 forumTopicId: 302141 dashedName: problem-466-distinct-terms-in-a-multiplication-table @@ -8,27 +8,27 @@ dashedName: problem-466-distinct-terms-in-a-multiplication-table # --description-- -Let $P(m,n)$ be the number of distinct terms in an $m×n$ multiplication table. +Lass $P(m,n)$ die Anzahl der verschiedenen Begriffe in einer $m×n$ Multiplikationstabelle sein. -For example, a 3×4 multiplication table looks like this: +Zum Beispiel sieht eine 3×4 Multiplikationstabelle so aus: $$\begin{array}{c} × & \mathbf{1} & \mathbf{2} & \mathbf{3} & \mathbf{4} \\\\ \mathbf{1} & 1 & 2 & 3 & 4 \\\\ \mathbf{2} & 2 & 4 & 6 & 8 \\\\ \mathbf{3} & 3 & 6 & 9 & 12 \end{array}$$ -There are 8 distinct terms {1, 2, 3, 4, 6, 8, 9, 12}, therefore $P(3, 4) = 8$. +Es gibt 8 verschiedene Begriffe {1, 2, 3, 4, 6, 8, 9, 12}, also $P(3, 4) = 8$. -You are given that: +Dir wird gegeben, dass: $$\begin{align} & P(64, 64) = 1\\,263, \\\\ & P(12, 345) = 1\\,998, \text{ and} \\\\ & P(32, {10}^{15}) = 13\\,826\\,382\\,602\\,124\\,302. \\\\ \end{align}$$ -Find $P(64, {10}^{16})$. +Finde $P(64, {10}^{16})$. # --hints-- -`multiplicationTable()` should return `258381958195474750`. +`multiplicationTable()` sollte `258381958195474750` zurückgeben. ```js assert.strictEqual(multiplicationTable(), 258381958195474750); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-467-superinteger.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-467-superinteger.md index 9b0caad1704..650b8db6176 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-467-superinteger.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-467-superinteger.md @@ -1,6 +1,6 @@ --- id: 5900f5411000cf542c510052 -title: 'Problem 467: Superinteger' +title: 'Problem 467: Super-Integer' challengeType: 1 forumTopicId: 302142 dashedName: problem-467-superinteger @@ -8,32 +8,32 @@ dashedName: problem-467-superinteger # --description-- -An integer $s$ is called a superinteger of another integer $n$ if the digits of $n$ form a subsequence of the digits of $s$. +Ein Integer $s$ wird als Super-Integer eines anderen Integers $n$ bezeichnet, wenn die Ziffern von $n$ eine Teilfolge der Ziffern von $s$ bilden. -For example, 2718281828 is a superinteger of 18828, while 314159 is not a superinteger of 151. +Zum Beispiel ist 2718281828 ein Super-Integer von 18828, während 314159 kein Super-Integer von 151 ist. -Let $p(n)$ be the $n$th prime number, and let $c(n)$ be the $n$th composite number. For example, $p(1) = 2$, $p(10) = 29$, $c(1) = 4$ and $c(10) = 18$. +Lass $p(n)$ die $n$-te Primzahl sein und lass $c(n)$ die $n$-te zusammengesetzte Zahl sein. Zum Beispiel $p(1) = 2$, $p(10) = 29$, $c(1) = 4$ und $c(10) = 18$. $$\begin{align} & \\{p(i) : i ≥ 1\\} = \\{2, 3, 5, 7, 11, 13, 17, 19, 23, 29, \ldots \\} \\\\ & \\{c(i) : i ≥ 1\\} = \\{4, 6, 8, 9, 10, 12, 14, 15, 16, 18, \ldots \\} \end{align}$$ -Let $P^D$ the sequence of the digital roots of $\\{p(i)\\}$ ($C^D$ is defined similarly for $\\{c(i)\\}$): +Lass $P^D$ die Folge der digitalen Wurzeln von $\\{p(i)\\}$ sein ($C^D$ ist ähnlich definiert für $\\{c(i)\\}$): $$\begin{align} & P^D = \\{2, 3, 5, 7, 2, 4, 8, 1, 5, 2, \ldots \\} \\\\ & C^D = \\{4, 6, 8, 9, 1, 3, 5, 6, 7, 9, \ldots \\} \end{align}$$ -Let $P_n$ be the integer formed by concatenating the first $n$ elements of $P^D$ ($C_n$ is defined similarly for $C^D$). +Lass $P_n$ den Integer sein, der durch die Verkettung der ersten $n$-Elemente von $P^D$ gebildet wird ($C_n$ ist ähnlich definiert für $C^D$). $$\begin{align} & P_{10} = 2\\,357\\,248\\,152 \\\\ & C_{10} = 4\\,689\\,135\\,679 \end{align}$$ -Let $f(n)$ be the smallest positive integer that is a common superinteger of $P_n$ and $C_n$. For example, $f(10) = 2\\,357\\,246\\,891\\,352\\,679$, and $f(100)\bmod 1\\,000\\,000\\,007 = 771\\,661\\,825$. +Lass $f(n)$ den kleinsten positiven Integer sein, der einen gemeinsamen Super-Integer von $P_n$ und $C_n$ ist. Zum Beispiel $f(10) = 2\\,357\\,246\\,891\\,352\\,679$, und $f(100)\bmod 1\\,000\\,000\\,007 = 771\\,661\\,825$. -Find $f(10\\,000)\bmod 1\\,000\\,000\\,007$. +Finde $f(10\\,000)\bmod 1\\,000\\,000\\,007$. # --hints-- -`superinteger()` should return `775181359`. +`superinteger()` sollte `775181359` zurückgeben. ```js assert.strictEqual(superinteger(), 775181359); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients.md index dbd4119b933..db21d3381aa 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients.md @@ -1,6 +1,6 @@ --- id: 5900f5411000cf542c510054 -title: 'Problem 468: Smooth divisors of binomial coefficients' +title: 'Problem 468: Glatte Teiler der Binomialkoeffizienten' challengeType: 1 forumTopicId: 302143 dashedName: problem-468-smooth-divisors-of-binomial-coefficients @@ -8,27 +8,27 @@ dashedName: problem-468-smooth-divisors-of-binomial-coefficients # --description-- -An integer is called B-smooth if none of its prime factors is greater than $B$. +Ein Integer heißt B-glatt, wenn keiner ihrer Primfaktoren größer als $B$ ist. -Let $SB(n)$ be the largest B-smooth divisor of $n$. +Lasse $SB(n)$ der größte B-glatte Teiler von $n$ sein. -Examples: +Beispiele: $$\begin{align} & S_1(10) = 1 \\\\ & S_4(2\\,100) = 12 \\\\ & S_{17}(2\\,496\\,144) = 5\\,712 \end{align}$$ -Define $F(n) = \displaystyle\sum_{B = 1}^n \sum_{r = 0}^n S_B(\displaystyle\binom{n}{r})$. Here, $\displaystyle\binom{n}{r}$ denotes the binomial coefficient. +Definiere $F(n) = \displaystyle\sum_{B = 1}^n \sum_{r = 0}^n S_B(\displaystyle\binom{n}{r})$. Dabei bezeichnet $\displaystyle\binom{n}{r}$ den Binomialkoeffizienten. -Examples: +Beispiele: $$\begin{align} & F(11) = 3132 \\\\ & F(1\\,111)\bmod 1\\,000\\,000\\,993 = 706\\,036\\,312 \\\\ & F(111\\,111)\bmod 1\\,000\\,000\\,993 = 22\\,156\\,169 \end{align}$$ -Find $F(11\\,111\\,111)\bmod 1\\,000\\,000\\,993$. +Finde $F(11\\,111\\,111)\bmod 1\\,000\\,000\\,993$. # --hints-- -`smoothDivisorsOfBinomialCoefficients()` should return `852950321`. +`smoothDivisorsOfBinomialCoefficients()` sollte `852950321` zurückgeben. ```js assert.strictEqual(smoothDivisorsOfBinomialCoefficients(), 852950321); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-469-empty-chairs.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-469-empty-chairs.md index 3dce49fdd9a..8918f027732 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-469-empty-chairs.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-469-empty-chairs.md @@ -1,6 +1,6 @@ --- id: 5900f5411000cf542c510053 -title: 'Problem 469: Empty chairs' +title: 'Problem 469: Freie Stühle' challengeType: 1 forumTopicId: 302144 dashedName: problem-469-empty-chairs @@ -8,21 +8,21 @@ dashedName: problem-469-empty-chairs # --description-- -In a room $N$ chairs are placed around a round table. +In einem Raum sind $N$ Stühle um einen runden Tisch herum aufgestellt. -Knights enter the room one by one and choose at random an available empty chair. +Die Ritter betreten nacheinander den Raum und wählen nach dem Zufallsprinzip einen freien Stuhl aus. -To have enough elbow room the knights always leave at least one empty chair between each other. +Um genügend Bewegungsfreiheit zu haben, lassen die Ritter immer mindestens einen Stuhl zwischen sich frei. -When there aren't any suitable chairs left, the fraction $C$ of empty chairs is determined. We also define $E(N)$ as the expected value of $C$. +Wenn es keine geeigneten Stühle mehr gibt, wird der Anteil $C$ der leeren Stühle bestimmt. Wir definieren auch $E(N)$ als den Erwartungswert von $C$. -We can verify that $E(4) = \frac{1}{2}$ and $E(6) = \frac{5}{9}$. +Wir können überprüfen, dass $E(4) = \frac{1}{2}$ und $E(6) = \frac{5}{9}$. -Find $E({10}^{18})$. Give your answer rounded to fourteen decimal places in the form 0.abcdefghijklmn. +Finde $E({10}^{18})$. Gebe deine Antwort auf vierzehn Dezimalstellen gerundet in der Form 0.abcdefghijklmn an. # --hints-- -`emptyChairs()` should return `0.56766764161831`. +`emptyChairs()` sollte `0.56766764161831` zurückgeben. ```js assert.strictEqual(emptyChairs(), 0.56766764161831); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-470-super-ramvok.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-470-super-ramvok.md index 7d0f1aad0ee..18e5009a4e0 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-470-super-ramvok.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-470-super-ramvok.md @@ -8,23 +8,23 @@ dashedName: problem-470-super-ramvok # --description-- -Consider a single game of Ramvok: +Nehmen wir ein einziges Spiel Ramvok: -Let $t$ represent the maximum number of turns the game lasts. If $t = 0$, then the game ends immediately. Otherwise, on each turn $i$, the player rolls a die. After rolling, if $i < t$ the player can either stop the game and receive a prize equal to the value of the current roll, or discard the roll and try again next turn. If $i = t$, then the roll cannot be discarded and the prize must be accepted. Before the game begins, $t$ is chosen by the player, who must then pay an up-front cost $ct$ for some constant $c$. For $c = 0$, $t$ can be chosen to be infinite (with an up-front cost of 0). Let $R(d, c)$ be the expected profit (i.e. net gain) that the player receives from a single game of optimally-played Ramvok, given a fair $d$-sided die and cost constant $c$. For example, $R(4, 0.2) = 2.65$. Assume that the player has sufficient funds for paying any/all up-front costs. +Lasse $t$ die maximale Anzahl an Spielzügen sein, die das Spiel dauert. Wenn $t = 0$, dann endet das Spiel sofort. Andernfalls würfelt der Spieler in jeder Runde $i$ einen Würfel. Wenn $i < t$ gewürfelt wurde, kann der Spieler entweder das Spiel beenden und einen Preis in Höhe des aktuellen Wurfes erhalten, oder den Wurf verwerfen und es in der nächsten Runde erneut versuchen. Ist $i = t$, so kann der Wurf nicht verworfen werden und der Gewinn muss angenommen werden. Bevor das Spiel beginnt, wird $t$ vom Spieler gewählt, der dann für eine gewisse Konstante $c$ eine Vorauszahlung $ct$ leisten muss. Für $c = 0$ kann $t$ unendlich groß gewählt werden (mit Vorlaufkosten von 0). Lasse $R(d, c)$ der erwartete Gewinn (d.h. der Nettogewinn) sein, den der Spieler aus einem einzigen optimal gespielten Ramvok-Spiel erhält, wenn er einen fairen Würfel mit $d$-Seiten und eine Kostenkonstante $c$ hat. Zum Beispiel, $R(4, 0.2) = 2.65$. Es wird davon ausgegangen, dass der Spieler über ausreichende finanzielle Mittel verfügt, um alle Vorabkosten zu bezahlen. -Now consider a game of Super Ramvok: +Betrachte nun eine Partie Super Ramvok: -In Super Ramvok, the game of Ramvok is played repeatedly, but with a slight modification. After each game, the die is altered. The alteration process is as follows: The die is rolled once, and if the resulting face has its pips visible, then that face is altered to be blank instead. If the face is already blank, then it is changed back to its original value. After the alteration is made, another game of Ramvok can begin (and during such a game, at each turn, the die is rolled until a face with a value on it appears). The player knows which faces are blank and which are not at all times. The game of Super Ramvok ends once all faces of the die are blank. +In Super Ramvok wird das Spiel Ramvok wiederholt, aber mit einer leichten Abwandlung gespielt. Nach jedem Spiel wird der Würfel verändert. Der Veränderungsprozess läuft folgendermaßen ab: Der Würfel wird einmal gewürfelt, und wenn die resultierende Seite die Punkte sichtbar macht, wird diese Seite in eine leere Seite umgewandelt. Wenn die Fläche bereits leer ist, wird sie auf ihren ursprünglichen Wert zurückgesetzt. Nachdem die Änderung vorgenommen wurde, kann eine neue Partie Ramvok beginnen (und während einer solchen Partie wird der Würfel bei jedem Zug geworfen, bis eine Seite mit einem Wert darauf erscheint). Der Spieler weiß zu jeder Zeit, welche Flächen leer sind und welche nicht. Das Spiel Super Ramvok endet, wenn alle Seiten des Würfels leer sind. -Let $S(d, c)$ be the expected profit that the player receives from an optimally-played game of Super Ramvok, given a fair $d$-sided die to start (with all sides visible), and cost constant $c$. For example, $S(6, 1) = 208.3$. +Lasse $S(d, c)$ der erwartete Gewinn sein, den der Spieler bei einer optimal gespielten Partie Super-Ramvok erhält, wenn er mit einem fairen Würfel mit $d$ Seiten (alle Seiten sichtbar) beginnt und die Kostenkonstante $c$ hat. Zum Beispiel $S(6, 1) = 208.3$. -Let $F(n) = \sum_{4 ≤ d ≤ n} \sum_{0 ≤ c ≤ n} S(d, c)$. +Lasse $F(n) = \sum_{4 ≤ d ≤ n} \sum_{0 ≤ c ≤ n} S(d, c)$ sein. -Calculate $F(20)$, rounded to the nearest integer. +Berechne $F(20)$, gerundet auf den nächsten Integer. # --hints-- -`superRamvok()` should return `147668794`. +`superRamvok()` sollte `147668794` zurückgeben. ```js assert.strictEqual(superRamvok(), 147668794); diff --git a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse.md b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse.md index 87fba0ff50a..d24ada7d785 100644 --- a/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse.md +++ b/curriculum/challenges/german/10-coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse.md @@ -1,6 +1,6 @@ --- id: 5900f5431000cf542c510056 -title: 'Problem 471: Triangle inscribed in ellipse' +title: 'Problem 471: Dreieck in Ellipse eingeschlossen' challengeType: 1 forumTopicId: 302148 dashedName: problem-471-triangle-inscribed-in-ellipse @@ -8,33 +8,33 @@ dashedName: problem-471-triangle-inscribed-in-ellipse # --description-- -The triangle $ΔABC$ is inscribed in an ellipse with equation $\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1$, $0 < 2b < a$, $a$ and $b$ integers. +Das Dreieck $ΔABC$ ist in eine Ellipse eingeschlossen mit der Gleichung $\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1$, $0 < 2b < a$, $a$ und $b$ Integer. -Let $r(a, b)$ be the radius of the incircle of $ΔABC$ when the incircle has center $(2b, 0)$ and $A$ has coordinates $\left(\frac{a}{2}, \frac{\sqrt{3}}{2}b\right)$. +Lasse $r(a, b)$ den Radius des Inkreises von $ΔABC$ sein, wenn der innere Kreis den Mittelpunkt $(2b, 0)$ und $A$ die Koordinaten $\left(\frac{a}{2}, \frac{\sqrt{3}}{2}b\right)$ hat. -For example, $r(3, 1) = \frac{1}{2}, r(6, 2) = 1, r(12, 3) = 2$. +Zum Beispiel: $r(3, 1) = \frac{1}{2}, r(6, 2) = 1, r(12, 3) = 2$. -triangle ΔABC inscribed in an ellipse, radius of the incircle of ΔABC r(6, 2) = 1 +Dreieck ΔABC eingeschlossen in eine Ellipse, Radius des Inkreises von ΔABC r(6, 2) = 1 -triangle ΔABC inscribed in an ellipse, radius of the incircle of ΔABC r(12, 3) = 2 +Dreieck ΔABC eingeschrieben in eine Ellipse, Radius des Inkreises von ΔABC r(12, 3) = 2 -Let $G(n) = \sum_{a = 3}^n \sum_{b = 1}^{\left\lfloor\frac{a - 1}{2} \right\rfloor} r(a, b)$ +Lasse $G(n) = \sum_{a = 3}^n \sum_{b = 1}^{\left\lfloor\frac{a - 1}{2} \right\rfloor} r(a, b)$ sein -You are given $G(10) = 20.59722222$, $G(100) = 19223.60980$ (rounded to 10 significant digits). +Du erhältst $G(10) = 20.59722222$, $G(100) = 19223.60980$ (gerundet auf 10 signifikante Stellen). -Find $G({10}^{11})$. Give your answer as a string in scientific notation rounded to 10 significant digits. Use a lowercase `e` to separate mantissa and exponent. +Finde $G({10}^{11})$. Gib deine Antwort als String in wissenschaftlicher Notation, gerundet auf 10 signifikante Stellen, an. Verwende ein kleines `e`, um Mantisse und Exponent zu trennen. -For $G(10)$ the answer would have been `2.059722222e1` +Für $G(10)$ hätte die Antwort `2.059722222e1` gelautet # --hints-- -`triangleInscribedInEllipse()` should return a string. +`triangleInscribedInEllipse()` sollte einen String zurückgeben. ```js assert(typeof triangleInscribedInEllipse() === 'string'); ``` -`triangleInscribedInEllipse()` should return the string `1.895093981e31`. +`triangleInscribedInEllipse()` sollte den String `1.895093981e31` zurückgeben. ```js assert.strictEqual(triangleInscribedInEllipse(), '1.895093981e31'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61329b210dac0b08047fd6ab.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61329b210dac0b08047fd6ab.md index c3a8b6ddbbd..01c1ffad195 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61329b210dac0b08047fd6ab.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61329b210dac0b08047fd6ab.md @@ -7,25 +7,25 @@ dashedName: step-3 # --description-- -Continuing with the `meta` elements, a `viewport` definition tells the browser how to render the page. Including one betters visual accessibility on mobile, and improves _SEO_ (search engine optimization). +Continuing with the `meta` elements, a `viewport` definition tells the browser how to render the page. Indem du eine solche hinzufügst, verbesserst du die visuelle Barrierefreiheit deiner Seite auf mobilen Endgeräten und dein _SEO_ (Search Engine Optimization – Suchmaschinenoptimierung). Füge eine `viewport`-Definition mit einem `content`-Attribut hinzu, das die `width` und den `initial-scale` der Seite beschreibt. # --hints-- -You should create another `meta` element in the `head`. +Du solltest ein weiteres `meta`-Element im `head`-Element erstellen. ```js assert.equal(document.querySelectorAll('head > meta')?.length, 2); ``` -You should give the `meta` a `name` attribute of `viewport`. +Du solltest dem `meta`-Element ein `name`-Attribut von `viewport` geben. ```js assert.equal(document.querySelectorAll('head > meta[name="viewport"]')?.length, 1); ``` -You should give the `meta` a `content` attribute of `width=device-width, initial-scale=1`. +Du solltest `meta` ein `content`-Attribut von `width=device-width, initial-scale=1` geben. ```js assert.equal(document.querySelectorAll('head > meta[content="width=device-width, initial-scale=1.0"]')?.length || document.querySelectorAll('head > meta[content="width=device-width, initial-scale=1"]')?.length, 1); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61329d52e5010e08d9b9d66b.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61329d52e5010e08d9b9d66b.md index 917e40146ce..81bc3eb37ed 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61329d52e5010e08d9b9d66b.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61329d52e5010e08d9b9d66b.md @@ -7,31 +7,31 @@ dashedName: step-4 # --description-- -Another important `meta` element for accessibility and SEO is the `description` definition. Der Wert des Attributs `content` wird von Suchmaschinen verwendet, um eine Beschreibung deiner Seite bereitzustellen. +Ein weiteres, für SEO und Barrierefreiheit wichtiges `meta`-Element ist die `description`-Definition. Der Wert des Attributs `content` wird von Suchmaschinen verwendet, um eine Beschreibung deiner Seite bereitzustellen. -Add a `meta` element with the `name` attribute set to `description`, and give it a useful `content` attribute. +Füge ein `meta`-Element hinzu, das über ein auf `description` gesetztes `name`-Attribut verfügt und weise diesem ein passendes `content`-Attribut zu. # --hints-- -You should add a new `meta` element to the `head`. +Du solltest dem `head` ein neues `meta`-Element hinzufügen. ```js assert.equal(document.querySelectorAll('meta').length, 3); ``` -You should give the `meta` a `name` attribute of `description`. +Du solltest `meta` ein, auf `description` gesetztes, `name`-Attribut zuweisen. ```js assert.exists(document.querySelector('meta[name="description"]')); ``` -You should give the `meta` a `content` attribute. +Du solltest `meta` ein `content`-Attribut zuweisen. ```js assert.notEmpty(document.querySelector('meta[name="description"]')?.content); ``` -The `content` attribute value should not be more than 165 characters. _Das ist die maximale Beschreibungslänge von Google._ +Der Wert des `content`-Attributs sollte 165 Zeichen nicht übersteigen. _Das ist die maximale Beschreibungslänge von Google._ ```js assert.isAtMost(document.querySelector('meta[name="description"]')?.content?.length, 165); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md index fcf1fcc41a5..d38ba19bcc5 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md @@ -9,7 +9,7 @@ dashedName: step-8 Eine nützliche Eigenschaft einer _SVG_ (scalable vector graphics, skalierbare Vektorgrafiken) ist, dass dieses ein `path`-Attribut enthält, mit welchem ein Bild, ohne die Auflösung des Resultats zu beeinflussen, skaliert werden kann. -Currently, the `img` is assuming its default size, which is too large. Korrigiere das, indem du das Bild mithilfe des Selektors `id` auf eine `width` von `max(100px, 18vw)` stellst. +Derzeit übernimmt das `img` die Ursprungsgröße, welche aber zu groß ist. Korrigiere das, indem du das Bild mithilfe des Selektors `id` auf eine `width` von `max(100px, 18vw)` stellst. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6140827cff96e906bd38fc2b.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6140827cff96e906bd38fc2b.md index 1d7705cbe4a..7c52f9241bd 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6140827cff96e906bd38fc2b.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6140827cff96e906bd38fc2b.md @@ -7,7 +7,7 @@ dashedName: step-9 # --description-- -As described in the freeCodeCamp Style Guide, the logo should retain an aspect ratio of `35 / 4`, and have padding around the text. +Wie im freeCodeCamp-Stil-Leitfaden beschrieben, sollte das Logo ein Seitenverhältnis von `35 / 4` beibehalten und genug Abstand zum Text halten. Ändere zuerst die `background-color` zu `#0a0a23`, damit du das Logo sehen kannst. Verwende anschließend die `aspect-ratio`-Eigenschaft, um das gewünschte Seitenverhältnis auf `35 / 4` einzustellen. Füge zum Schluss ein `padding`von `0.4rem` an allen Seiten hinzu. diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6140883f74224508174794c0.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6140883f74224508174794c0.md index b70214a3945..9b260a413a2 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6140883f74224508174794c0.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6140883f74224508174794c0.md @@ -7,7 +7,7 @@ dashedName: step-10 # --description-- -Make the `header` take up the full width of its parent container, set its `height` to `50px`, and set the `background-color` to `#1b1b32`. Then, set the `display` to use _Flexbox_. +Lasse den `header` die volle Breite seines übergeordneten Containers annehmen, setze die `height` auf `50px` und setze die `background-color` auf `#1b1b32`. Setze `display` anschließend auf _Flexbox_. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61408e4ae3e35d08feb260eb.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61408e4ae3e35d08feb260eb.md index 52842563298..137ed164e36 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61408e4ae3e35d08feb260eb.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61408e4ae3e35d08feb260eb.md @@ -7,7 +7,7 @@ dashedName: step-11 # --description-- -Change the `h1` font color to `#f1be32`, and set the font size to `min(5vw, 1.2em)`. +Setze die `h1`-Schriftfarbe auf `#f1be32` und die Schriftgröße auf `min(5vw, 1.2em)`. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6141fabd6f75610664e908fd.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6141fabd6f75610664e908fd.md index 671aa32e1dd..0a3b7701a57 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6141fabd6f75610664e908fd.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6141fabd6f75610664e908fd.md @@ -7,37 +7,37 @@ dashedName: step-14 # --description-- -As this is a quiz, you will need a form for users to submit answers. Du kannst den Inhalt innerhalb des Formulars mit `section`-Elementen semantisch trennen. +Da es sich um ein Quiz handelt, brauchst du ein Formular, in das Nutzer ihre Antworten eintragen können. Du kannst den Inhalt innerhalb des Formulars mit `section`-Elementen semantisch trennen. -Within the `main` element, create a form with three nested `section` elements. Then, make the form submit to `https://freecodecamp.org/practice-project/accessibility-quiz`, using the correct method. +Erstelle innerhalb des `main`-Elements ein Formular, das drei verschachtelte `section`-Elemente enthält. Übermittle dann das Formular mit der richtigen Methode an `https://freecodecamp.org/practice-project/accessibility-quiz`. # --hints-- -You should nest a `form` element within your `main` element. +Verschachtele das `form`-Element innerhalb deines `main`-Elements. ```js assert.exists(document.querySelector('main > form')); ``` -You should nest three `section` elements within your `form` element. +Du solltest drei `section`-Elemente in deinem `form`-Element verschachteln. ```js assert.equal(document.querySelectorAll('main > form > section')?.length, 3); ``` -You should give the `form` element an `action` attribute. +Du solltest dem `form`-Element ein `action`-Attribut geben. ```js assert.notEmpty(document.querySelector('main > form')?.action); ``` -You should give the `action` attribute a value of `https://freecodecamp.org/practice-project/accessibility-quiz`. +Du solltest dem `action`-Attribut den Wert `https://freecodecamp.org/practice-project/accessibility-quiz` geben. ```js assert.equal(document.querySelector('main > form')?.action, 'https://freecodecamp.org/practice-project/accessibility-quiz'); ``` -You should give the `form` element a `method` attribute. +Du solltest dem `form`-Element ein `method`-Attribut geben. ```js assert.notEmpty(document.querySelector('main > form')?.method); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614206033d366c090ca7dd42.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614206033d366c090ca7dd42.md index 16099768b69..384219d369f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614206033d366c090ca7dd42.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614206033d366c090ca7dd42.md @@ -11,18 +11,18 @@ Typeface plays an important role in the accessibility of a page. Einige Schrifta Change the font for both the `h1` and `h2` elements to `Verdana`, and use another web-safe font in the sans-serif family as a fallback. -Also, add a `border-bottom` of `4px solid #dfdfe2` to `h2` elements to make the sections distinct. +Füge außerdem einen `border-bottom` von `4px solid #dfdfe2` den `h2`-Elementen hinzu, um die Abschnitte zu unterscheiden. # --hints-- -You should use a multiple element selector to target the `h1` and `h2` elements. +Du solltest einen Mehrfach-Elementselektor verwenden, um `h1`- und `h2`-Elemente auszuwählen. ```js const gs = (s) => new __helpers.CSSHelp(document).getStyle(s); assert.exists(gs('h1, h2') || gs('h2, h1')); ``` -You should set the first value of the `font-family` property to `Verdana`. +Du solltest den ersten Wert der `font-family`-Eigenschaft auf `Verdana` ändern. ```js const gs = (s) => new __helpers.CSSHelp(document).getStyle(s); @@ -30,7 +30,7 @@ const style = gs('h1, h2') || gs('h2, h1'); assert.include(style?.fontFamily, 'Verdana'); ``` -You should set the second value of the `font-family` property to another sans-serif, web safe font. _Tipp: Ich würde Tahoma wählen_. +Du solltest den zweiten Wert der Eigenschaft `font-family` auf eine andere serifenlose, websichere Schriftart ändern. _Tipp: Ich würde Tahoma wählen_. ```js // Acceptable fonts: Arial, sans-serif, Helvetica, Tahoma, Trebuchet MS. @@ -39,7 +39,7 @@ const style = gs('h1, h2') || gs('h2, h1'); assert.match(style?.fontFamily, /(Tahoma)|(Arial)|(sans-serif)|(Helvetica)|(Trebuchet MS)/); ``` -You should use an `h2` element selector to target the `h2` elements. +Du solltest einen `h2`-Elementselektor verwenden, um die `h2`-Elemente auszuwählen. ```js assert.exists(new __helpers.CSSHelp(document).getStyle('h2')); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61435e3c0679a306c20f1acc.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61435e3c0679a306c20f1acc.md index 21cdb692734..5de80a6c409 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61435e3c0679a306c20f1acc.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61435e3c0679a306c20f1acc.md @@ -7,7 +7,7 @@ dashedName: step-18 # --description-- -To be able to navigate within the page, give each anchor element an `href` corresponding to the `id` of the `h2` elements. +Um innerhalb der Seite navigieren zu können, gib jedem Anker-Element ein `href` entsprechend der `id` der `h2`-Elemente. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143610161323a081b249c19.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143610161323a081b249c19.md index 607df7475c9..8da85cd6c49 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143610161323a081b249c19.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143610161323a081b249c19.md @@ -37,7 +37,7 @@ You should give the third `div` a `class` of `info`. assert.equal(document.querySelectorAll('h2#student-info ~ div')?.[2]?.className, 'info'); ``` -You should nest one `label` element within the first `div`. +Du solltest ein `label`-Element innerhalb des ersten `div` verschachteln. ```js assert.equal(document.querySelectorAll('h2#student-info ~ div')?.[0]?.querySelectorAll('label')?.length, 1); @@ -50,7 +50,7 @@ assert.equal(document.querySelectorAll('h2#student-info ~ div')?.[0]?.querySelec assert.exists(document.querySelectorAll('h2#student-info ~ div')?.[0]?.querySelector('label + input')); ``` -You should nest one `label` element within the second `div`. +Du solltest ein `label`-Element innerhalb des zweiten `div` verschachteln. ```js assert.equal(document.querySelectorAll('h2#student-info ~ div')?.[1]?.querySelectorAll('label')?.length, 1); @@ -63,7 +63,7 @@ assert.equal(document.querySelectorAll('h2#student-info ~ div')?.[1]?.querySelec assert.exists(document.querySelectorAll('h2#student-info ~ div')?.[1]?.querySelector('label + input')); ``` -You should nest one `label` element within the third `div`. +Du solltest ein `label`-Element innerhalb des dritten `div` verschachteln. ```js assert.equal(document.querySelectorAll('h2#student-info ~ div')?.[2]?.querySelectorAll('label')?.length, 1); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143639d5eddc7094161648c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143639d5eddc7094161648c.md index 61a4510e778..fb6db1970db 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143639d5eddc7094161648c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143639d5eddc7094161648c.md @@ -7,45 +7,45 @@ dashedName: step-20 # --description-- -Es ist wichtig, jeden `input` mit dem entsprechenden `label`-Element zu verknüpfen. This provides assistive technology users with a visual reference to the input. +Es ist wichtig, jeden `input` mit dem entsprechenden `label`-Element zu verknüpfen. Dadurch erhalten Nutzer assistiver Technologien einen visuellen Hinweis auf den Input. Dies geschieht, indem `label` ein `for`-Attribut gegeben wird, das die `id` des `input` enthält. -This section will take a student's name, email address, and date of birth. Gib den `label`-Elementen geeignete `for`-Attribute sowie einen Textinhalt. Verknüpfe anschließend die `input`-Elemente mit den entsprechenden `label`-Elementen. +In diesem Abschnitt werden der Name, die E-Mail-Adresse und das Geburtsdatum der Studierenden eingegeben. Gib den `label`-Elementen geeignete `for`-Attribute sowie einen Textinhalt. Verknüpfe anschließend die `input`-Elemente mit den entsprechenden `label`-Elementen. # --hints-- -You should give the first `label` element an appropriate `for` attribute. +Du solltest dem ersten `label`-Element ein geeignetes `for`-Attribut zuweisen. ```js assert.isAtLeast(document.querySelectorAll('label')?.[0]?.htmlFor?.length, 1); ``` -You should give the second `label` element an appropriate `for` attribute. +Du solltest dem zweiten `label`-Element ein geeignetes `for`-Attribut zuweisen. ```js assert.isAtLeast(document.querySelectorAll('label')?.[1]?.htmlFor?.length, 1); ``` -You should give the third `label` element an appropriate `for` attribute. +Du solltest dem dritten `label`-Element ein geeignetes `for`-Attribut zuweisen. ```js assert.isAtLeast(document.querySelectorAll('label')?.[2]?.htmlFor?.length, 1); ``` -You should give the first `label` element an appropriate text content. +Du solltest dem ersten `label`-Element einen geeigneten Textinhalt zuweisen. ```js assert.isAtLeast(document.querySelectorAll('label')?.[0]?.textContent?.length, 1); ``` -You should give the second `label` element an appropriate text content. +Du solltest dem zweiten `label`-Element einen geeigneten Textinhalt zuweisen. ```js assert.isAtLeast(document.querySelectorAll('label')?.[1]?.textContent?.length, 1); ``` -You should give the third `label` element an appropriate text content. +Du solltest dem dritten `label`-Element einen geeigneten Textinhalt zuweisen. ```js assert.isAtLeast(document.querySelectorAll('label')?.[2]?.textContent?.length, 1); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143920c8eafb00b735746ce.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143920c8eafb00b735746ce.md index 113e0a19bd7..ab43732742b 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143920c8eafb00b735746ce.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143920c8eafb00b735746ce.md @@ -7,13 +7,13 @@ dashedName: step-22 # --description-- -Even though you added a `placeholder` to the first `input` element in the previous lesson, this is actually not a best-practice for accessibility; too often, users confuse the placeholder text with an actual input value - they think there is already a value in the input. +In der letzten Lektion hast du jedem `input`-Element einen `placeholder` gegeben, obwohl dies eigentlich keine optimale Vorgehensweise für verbesserte Barrierefreiheit ist. Zu oft verwechseln Nutzer den Text des Platzhalters mit einem tatsächlichen Eingabewert – sie denken, dieses Feld würde bereits einen Wert enthalten. Remove the placeholder text from the first `input` element, relying on the `label` being the best-practice. # --hints-- -You should remove the `placeholder` attribute from the first `input` element. +Du solltest das `placeholder`-Attribut aus dem ersten `input`-Element entfernen. ```js assert.isEmpty(document.querySelectorAll('input')?.[0]?.placeholder); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143931a113bb80c45546287.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143931a113bb80c45546287.md index 7d6bf69b60e..b32c7c38752 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143931a113bb80c45546287.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143931a113bb80c45546287.md @@ -7,13 +7,13 @@ dashedName: step-23 # --description-- -Vermutlich ist `D.O.B.` nicht beschreibend genug. Dies gilt insbesondere für sehbehinderte Nutzer. One way to get around such an issue, without having to add visible text to the label, is to add text only a screen reader can read. +Vermutlich ist `D.O.B.` nicht beschreibend genug. Dies gilt insbesondere für sehbehinderte Nutzer. Eine Möglichkeit, ein solches Problem zu umgehen, ohne dem Label sichtbaren Text hinzufügen zu müssen, besteht darin, Text hinzuzufügen, den nur ein Screen-Reader lesen kann. Append a `span` element with a class of `sr-only` to the current text content of the third `label` element. # --hints-- -You should add a `span` element within the third `label` element. +Du solltest ein `span`-Element innerhalb des dritten `label`-Elements einfügen. ```js assert.exists(document.querySelector('.info:nth-of-type(3) > label > span')); @@ -25,7 +25,7 @@ Du solltest dem `span`-Element die Klasse `sr-only` zuweisen. assert.equal(document.querySelector('.info:nth-of-type(3) > label > span')?.className, 'sr-only'); ``` -You should place the `span` after the text content `D.O.B.`. +Du solltest `span` hinter dem Textinhalt `D.O.B.` setzen. ```js assert.match(document.querySelector('.info:nth-of-type(3) > label')?.innerHTML, /D\.O\.B\. div')?.length, 2); @@ -31,7 +31,7 @@ Du solltest dem zweiten neuen `div`-Element die Klasse `question-block` zuweisen assert.equal(document.querySelectorAll('section:nth-of-type(2) > div')?.[1]?.className, 'question-block'); ``` -You should nest one `p` element within each `div.question-block` element. +Du solltest ein `p`-Element innerhalb eines jeden `div.question-block`-Elements verschachteln. ```js assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > p')?.length, 2); @@ -49,19 +49,19 @@ Du solltest dem zweiten `p` Element den Text `2` zuweisen. assert.equal(document.querySelectorAll('section:nth-of-type(2) > div.question-block > p')?.[1]?.textContent, '2'); ``` -You should nest one `fieldset` element within each `div.question-block` element. +Du solltest ein `fieldset`-Element innerhalb eines jeden `div.question-block`-Elements verschachteln. ```js 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 `p` element. +Du solltest das erste `fieldset`-Element nach dem ersten `p`-Element einfügen. ```js assert.exists(document.querySelector('section:nth-of-type(2) > div.question-block > p + fieldset')); ``` -You should place the second `fieldset` element after the second `p` element. +Du solltest das zweite `fieldset`-Element nach dem zweiten `p`-Element einfügen. ```js assert.exists(document.querySelector('section:nth-of-type(2) > div.question-block:nth-of-type(2) > p + fieldset')); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143cb26f7edff2dc28f7da5.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143cb26f7edff2dc28f7da5.md index a0aedf75e52..dcbc38ee34a 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143cb26f7edff2dc28f7da5.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143cb26f7edff2dc28f7da5.md @@ -7,7 +7,7 @@ dashedName: step-27 # --description-- -Each `fieldset` will contain a true/false question. +Jedes `fieldset` enthält eine true/false-Frage. Within each `fieldset`, nest one `legend` element, and one `ul` element with two options. diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144e818fd5ea704fe56081d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144e818fd5ea704fe56081d.md index 035c61b1ca9..687ee3d388c 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144e818fd5ea704fe56081d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144e818fd5ea704fe56081d.md @@ -7,19 +7,19 @@ dashedName: step-28 # --description-- -Give each `fieldset` an adequate `name` attribute. Then, give both unordered lists a `class` of `answers-list`. +Gib jedem `fieldset` ein passendes `name`-Attribut. Gib dann beiden ungeordneten Listen eine `class` von `answers-list`. Finally, use the `legend` to caption the content of the `fieldset` by placing a true/false question as the text content. # --hints-- -You should give the first `fieldset` an adequate `name` attribute. _Hint: I would use `html-question-one`_ +Du solltest dem ersten `fieldset` ein passendes `name`-Attribut zuweisen. _Hint: I would use `html-question-one`_ ```js assert.notEmpty(document.querySelectorAll('fieldset')?.[0]?.name); ``` -You should give the second `fieldset` an adequate `name` attribute. _Hint: I would use `html-question-two`_ +Du solltest dem zweiten `fieldset` ein passendes `name`-Attribut geben. _Hint: I would use `html-question-two`_ ```js assert.notEmpty(document.querySelectorAll('fieldset')?.[1]?.name); @@ -37,19 +37,19 @@ You should give the second `ul` element a `class` of `answers-list`. assert.equal(document.querySelectorAll('fieldset > ul')?.[1]?.className, 'answers-list'); ``` -You should give the first `legend` element text content. +Du solltest dem ersten `legend`-Element einen Textinhalt geben. ```js assert.notEmpty(document.querySelectorAll('legend')?.[0]?.textContent); ``` -You should give the second `legend` element text content. +Du solltest dem zweiten `legend`-Element einen Textinhalt geben. ```js assert.notEmpty(document.querySelectorAll('legend')?.[1]?.textContent); ``` -You should not use the same text content for both `legend` elements. +Du solltest nicht den gleichen Textinhalt für beide `legend`-Elemente verwenden. ```js assert.notEqual(document.querySelectorAll('legend')?.[0]?.textContent, document.querySelectorAll('legend')?.[1]?.textContent); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e6eeaa66c605eb087fe9.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e6eeaa66c605eb087fe9.md index 056605a482a..fd0355be146 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e6eeaa66c605eb087fe9.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e6eeaa66c605eb087fe9.md @@ -7,29 +7,29 @@ dashedName: step-30 # --description-- -Add an `id` to all of your radio `input`s so you can link your labels to them. Give the first one an `id` of `q1-a1`. Give the rest of them `id`s of `q1-a2`, `q2-a1`, and `q2-a2`, respectively. +Add an `id` to all of your radio `input`s so you can link your labels to them. Gib dem ersten eine `id` von `q1-a1`. Gib dem Rest jeweils folgende `id`s: `q1-a2`, `q2-a1` und `q2-a2`. # --hints-- -You should give the first `input` element an `id` of `q1-a1`. +Du solltest dem ersten `input`-Element eine `id` von `q1-a1` zuweisen. ```js assert.equal(document.querySelectorAll('ul.answers-list > li > label > input')?.[0]?.id, "q1-a1"); ``` -You should give the second `input` element an `id` of `q1-a2`. +Du solltest dem zweiten `input`-Element eine `id` von `q1-a2` zuweisen. ```js assert.equal(document.querySelectorAll('ul.answers-list > li > label > input')?.[1]?.id, "q1-a2"); ``` -You should give the third `input` element an `id` of `q2-a1`. +Du solltest dem dritten `input`-Element eine `id` von `q2-a1` zuweisen. ```js assert.equal(document.querySelectorAll('ul.answers-list > li > label > input')?.[2]?.id, "q2-a1"); ``` -You should give the fourth `input` element an `id` of `q2-a2`. +Du solltest dem vierten `input`-Element eine `id` von `q2-a2` zuweisen. ```js assert.equal(document.querySelectorAll('ul.answers-list > li > label > input')?.[3]?.id, "q2-a2"); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e8b5080a5f06bb0223d0.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e8b5080a5f06bb0223d0.md index 77dd0453714..0109d60dd76 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e8b5080a5f06bb0223d0.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e8b5080a5f06bb0223d0.md @@ -1,6 +1,6 @@ --- id: 6145e8b5080a5f06bb0223d0 -title: Step 32 +title: Schritt 32 challengeType: 0 dashedName: step-32 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ed1f22caab087630aaad.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ed1f22caab087630aaad.md index 1d22fab184d..5fb112e75ff 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ed1f22caab087630aaad.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ed1f22caab087630aaad.md @@ -17,7 +17,7 @@ Du solltest den `p::before`-Selektor verwenden. assert.exists(new __helpers.CSSHelp(document).getStyle('p::before')); ``` -You should give the `p::before` pseudo-element a `content` property of `"Question #"`. +Du solltest dem `p::before`-Pseudo-Element eine `content`-Eigenschaft von `"Question #"` zuweisen. ```js assert.include(new __helpers.CSSHelp(document).getStyle('p::before')?.content, 'Question #'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ee65e2e1530938cb594d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ee65e2e1530938cb594d.md index 4533c9e4b24..c70ce498d49 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ee65e2e1530938cb594d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ee65e2e1530938cb594d.md @@ -1,6 +1,6 @@ --- id: 6145ee65e2e1530938cb594d -title: Step 35 +title: Schritt 35 challengeType: 0 dashedName: step-35 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md index a85127f2369..e2df1b77b7f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md @@ -23,13 +23,13 @@ You should nest one `label` element within the second `div.question-block` eleme assert.exists(document.querySelectorAll('.formrow > .question-block')?.[1]?.querySelector('label')); ``` -You should give the first `label` element text content. +Du solltest dem ersten `label`-Element Textinhalt geben. ```js assert.isAtLeast(document.querySelectorAll('.formrow > .question-block')?.[0]?.querySelector('label')?.textContent?.length, 1); ``` -You should give the second `label` element text content. +Du solltest dem zweiten `label`-Element Textinhalt geben. ```js assert.isAtLeast(document.querySelectorAll('.formrow > .question-block')?.[1]?.querySelector('label')?.textContent?.length, 1); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f14f019a4b0adb94b051.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f14f019a4b0adb94b051.md index 233c361601e..695322341e6 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f14f019a4b0adb94b051.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f14f019a4b0adb94b051.md @@ -9,7 +9,7 @@ dashedName: step-37 Within the first `div.answer` element, nest one required `select` element with three `option` elements. -Give the first `option` element a `value` of `""`, and the text `Select an option`. Give the second `option` element a `value` of `yes`, and the text `Yes`. Give the third `option` element a `value` of `no`, and the text `No`. +Gib dem ersten `option`-Element eine `value` von `""` und den Text `Select an option`. Gib dem zweiten `option`-Element eine `value` von `yes` und den Text `Yes`. Gib dem dritten `option`-Element eine `value` von `no` und den Text `No`. # --hints-- @@ -19,43 +19,43 @@ Du solltest ein `select`-Element innerhalb des ersten `div.answer`-Elements vers assert.exists(document.querySelector('div.answer > select')); ``` -You should nest three `option` elements within the `select` element. +Du solltest drei `option`-Elemente innerhalb des `select`-Elements verschachteln. ```js assert.equal(document.querySelectorAll('div.answer > select > option')?.length, 3); ``` -You should give the first `option` element a `value` of `""`. +Du solltest dem ersten `option`-Element eine `value` von `""` geben. ```js assert.equal(document.querySelector('div.answer > select > option:nth-child(1)')?.value, ''); ``` -You should give the first `option` element a text content of `Select an option`. +Du solltest dem ersten `option`-Element den Textinhalt `Select an option` geben. ```js assert.equal(document.querySelector('div.answer > select > option:nth-child(1)')?.textContent, 'Select an option'); ``` -You should give the second `option` element a `value` of `yes`. +Du solltest dem zweiten `option`-Element eine `value` von `yes` geben. ```js assert.equal(document.querySelector('div.answer > select > option:nth-child(2)')?.value, 'yes'); ``` -You should give the second `option` element a text content of `Yes`. +Du solltest dem zweiten `option`-Element den Textinhalt `Yes` geben. ```js assert.equal(document.querySelector('div.answer > select > option:nth-child(2)')?.textContent, 'Yes'); ``` -You should give the third `option` element a `value` of `no`. +Du solltest dem dritten `option`-Element eine `value` von `no` geben. ```js assert.equal(document.querySelector('div.answer > select > option:nth-child(3)')?.value, 'no'); ``` -You should give the third `option` element a text content of `No`. +Du solltest dem dritten `option`-Element den Textinhalt `No` geben. ```js assert.equal(document.querySelector('div.answer > select > option:nth-child(3)')?.textContent, 'No'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f3a5cd9be60b9459cdd6.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f3a5cd9be60b9459cdd6.md index 7a093a5b2b4..8f3f751bbd7 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f3a5cd9be60b9459cdd6.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f3a5cd9be60b9459cdd6.md @@ -11,13 +11,13 @@ Verknüpfe das erste `label`-Element mit dem `select`-Element und gib dem `selec # --hints-- -You should give the `label` element a `for` attribute. +Du solltest dem `label`-Element ein `for`-Attribut zuweisen. ```js assert.notEmpty(document.querySelector('.question-block > label')?.htmlFor); ``` -You should give the `select` element an `id` attribute. +Du solltest dem `select`-Element ein `id`-Attribut zuweisen. ```js assert.notEmpty(document.querySelector('.answer > select')?.id); @@ -29,7 +29,7 @@ Du solltest dem `select`-Element eine `id` geben, die dem `for`-Attribut des `la assert.equal(document.querySelector('.answer > select')?.id, document.querySelector('.question-block > label')?.htmlFor); ``` -You should give the `select` element a `name` attribute. +Du solltest dem `select`-Element ein `name`-Attribut zuweisen. ```js assert.notEmpty(document.querySelector('.answer > select')?.name); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f47393fbe70c4d885f9c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f47393fbe70c4d885f9c.md index 270a3e2544c..2339afa6561 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f47393fbe70c4d885f9c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f47393fbe70c4d885f9c.md @@ -1,6 +1,6 @@ --- id: 6145f47393fbe70c4d885f9c -title: Step 39 +title: Schritt 39 challengeType: 0 dashedName: step-39 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fc3707fc3310c277f5c8.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fc3707fc3310c277f5c8.md index a461adbd419..870d790bb63 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fc3707fc3310c277f5c8.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fc3707fc3310c277f5c8.md @@ -7,7 +7,7 @@ dashedName: step-45 # --description-- -Back to styling the page. Wähle die Listenelemente innerhalb der Navigationsleiste aus und gib ihnen die folgenden Formatierungen: +Zurück zur Seitengestaltung. Wähle die Listenelemente innerhalb der Navigationsleiste aus und gib ihnen die folgenden Formatierungen: ```css color: #dfdfe2; diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614796cb8086be482d60e0ac.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614796cb8086be482d60e0ac.md index 3d68998d683..11cec65cef9 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614796cb8086be482d60e0ac.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614796cb8086be482d60e0ac.md @@ -7,7 +7,7 @@ dashedName: step-46 # --description-- -On the topic of visual accessibility, contrast between elements is a key factor. For example, the contrast between the text and the background of a heading should be at least 4.5:1. +Geht es um visuelle Barrierefreiheit, ist der Kontrast zwischen Elementen ein Schlüsselfaktor. For example, the contrast between the text and the background of a heading should be at least 4.5:1. Change the font color of all the anchor elements within the list elements to something with a contrast ratio of at least 7:1. diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614878f7a412310647873015.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614878f7a412310647873015.md index 9ec3502155b..2c97a2928be 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614878f7a412310647873015.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614878f7a412310647873015.md @@ -9,7 +9,7 @@ dashedName: step-48 Tidy up the `header`, by using _Flexbox_ to put space between the children, and vertically center them. -Then, fix the `header` to the top of the viewport. +Fixiere anschließend den `header` an den oberen Rand des Viewports. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487b77d4a37707073a64e5.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487b77d4a37707073a64e5.md index 964c4af01d7..57e98f29a6c 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487b77d4a37707073a64e5.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487b77d4a37707073a64e5.md @@ -31,7 +31,7 @@ Du solltest `main` ein `padding-top` von mindestens `25px` geben. assert.isAtLeast(Number(new __helpers.CSSHelp(document).getStyle('main')?.paddingTop?.replace(/\D+/, '')), 25); ``` -You should only change the `padding-top` value. +Du solltest nur den `padding-top`-Wert anpassen. ```js assert.isEmpty(new __helpers.CSSHelp(document).getStyle('main')?.paddingBottom); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614884c1f5d6f30ab3d78cde.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614884c1f5d6f30ab3d78cde.md index 96beebd7200..68774b71bea 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614884c1f5d6f30ab3d78cde.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614884c1f5d6f30ab3d78cde.md @@ -100,7 +100,7 @@ Du solltest den `input` Selektor verwenden, um das `input` Element auszuwählen. assert.exists(new __helpers.CSSHelp(document).getStyle('input')); ``` -You should give the `input` a `font-size` greater than `13px`. +Du solltest dem `input` eine `font-size` zuweisen, die größer als `13px` ist. ```js const val = new __helpers.CSSHelp(document).getStyle('input')?.fontSize; diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614ccc21ea91ef1736b9b578.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614ccc21ea91ef1736b9b578.md index fea80e7e916..00c3f59dfcd 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614ccc21ea91ef1736b9b578.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614ccc21ea91ef1736b9b578.md @@ -7,9 +7,9 @@ dashedName: step-1 # --description-- -Welcome to the first part of the Accessibility Quiz. Da du langsam ein erfahrener HTML- und CSS-Entwickler wirst, haben wir dich bereits mit dem grundlegenden Boilerplate-Code ausgestattet. +Willkommen zum ersten Teil des Barrierefreiheit-Quiz. Da du langsam ein erfahrener HTML- und CSS-Entwickler wirst, haben wir dich bereits mit dem grundlegenden Boilerplate-Code ausgestattet. -Start this accessibility journey by providing a `lang` attribute to your `html` element. Das hilft Bildschirmleseprogrammen bei der Identifizierung der Seitensprache. +Beginne diese Einführung in die Barrierefreiheit, indem du deinem `html`-Element ein `lang`-Attribut hinzufügst. Das hilft Bildschirmleseprogrammen bei der Identifizierung der Seitensprache. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f33071498eb2472b87ddee4.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f33071498eb2472b87ddee4.md index 6cacfeae778..58eed7369cd 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f33071498eb2472b87ddee4.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f33071498eb2472b87ddee4.md @@ -7,13 +7,13 @@ dashedName: step-1 # --description-- -As you learned in the last few steps of the Cat Photo App, there is a basic structure needed to start building your web page. +Wie du in den letzten Schritten der Katzenfoto-App bereits gelernt hast, ist eine grundlegende Struktur erforderlich, um deine Webseite zu erstellen. Add the `` tag, and an `html` element with a `lang` attribute of `en`. # --hints-- -You should have the `DOCTYPE` declaration. +Du solltest eine `DOCTYPE`-Deklaration haben. ```js assert(code.match(//i)); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3313e74582ad9d063e3a38.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3313e74582ad9d063e3a38.md index a880fd1236c..5029467b1ba 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3313e74582ad9d063e3a38.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3313e74582ad9d063e3a38.md @@ -7,7 +7,7 @@ dashedName: step-2 # --description-- -Add a `head` element within the `html` element, so you can add a `title` element. The `title` element's text should be `Cafe Menu`. +Add a `head` element within the `html` element, so you can add a `title` element. Der Text des `title`-Elements sollte `Cafe Menu` sein. # --hints-- @@ -17,7 +17,7 @@ You should have an opening `` tag. assert(code.match(//i)); ``` -You should have a closing `` tag. +Du solltest ein schließendes ``-Tag haben. ```js assert(code.match(//i)); @@ -29,7 +29,7 @@ You should have an opening `` tag. assert(code.match(/<title>/i)); ``` -You should have a closing `` tag. +Du solltest ein schließendes ``-Tag haben. ```js assert(code.match(/<\/title>/i)); @@ -41,7 +41,7 @@ Your `title` element should be nested in your `head` element. assert(code.match(/\s*.*<\/title>\s*<\/head>/si)); ``` -Your `title` element should have the text `Cafe Menu`. You may need to check your spelling. +Your `title` element should have the text `Cafe Menu`. Möglicherweise musst du deine Rechtschreibung überprüfen. ```js assert.match(document.querySelector('title')?.innerText, /Cafe Menu/i); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f344fad8bf01691e71a30eb.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f344fad8bf01691e71a30eb.md index 79be4103480..8ed29476b9f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f344fad8bf01691e71a30eb.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f344fad8bf01691e71a30eb.md @@ -17,7 +17,7 @@ Your code should have an opening `<style>` tag. assert(code.match(/<style\s*>/i)); ``` -Your code should have a closing `</style>` tag. +Dein Code sollte ein schließendes `</style>`-Tag haben. ```js assert(code.match(/<\/style\s*>/)); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f344fbc22624a2976425065.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f344fbc22624a2976425065.md index 35080873435..5155032794c 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f344fbc22624a2976425065.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f344fbc22624a2976425065.md @@ -17,13 +17,13 @@ You should have an opening `<h2>` tag. assert(code.match(/<h2\s*>/i)); ``` -You should have a closing `</h2>` tag. +Du solltest ein schließendes `</h2>`-Tag haben. ```js assert(code.match(/<\/h2\s*>/i)); ``` -You should not change your existing `section` element. Make sure you did not delete the closing tag. +Du solltest das vorhandene `section`-Element nicht verändern. Stelle sicher, dass du das schließende Tag nicht gelöscht hast. ```js assert($('section').length === 1); @@ -36,7 +36,7 @@ const h2 = document.querySelector('h2'); assert(h2.parentElement.tagName === 'SECTION'); ``` -Your `h2` element should have the text `Coffee`. +Dein `h2`-Element sollte den Text `Coffee` haben. ```js const h2 = document.querySelector('h2'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3477ae9675db8bb7655b30.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3477ae9675db8bb7655b30.md index ef0054c8b52..837a78af300 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3477ae9675db8bb7655b30.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3477ae9675db8bb7655b30.md @@ -7,7 +7,7 @@ dashedName: step-12 # --description-- -In the previous step, you used a <dfn>type selector</dfn> to style the `h1` element. Center the `h2` and `p` elements by adding a new type selector for each one to the existing `style` element. +Im vorherigen Schritt hast du einen <dfn>type selector</dfn> verwendet, um das `h1`-Element zu gestalten. Center the `h2` and `p` elements by adding a new type selector for each one to the existing `style` element. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f356ed656a336993abd9f7c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f356ed656a336993abd9f7c.md index 82834b82d6a..4853dab6771 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f356ed656a336993abd9f7c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f356ed656a336993abd9f7c.md @@ -7,7 +7,7 @@ dashedName: step-25 # --description-- -Als nächstes möchtest du den `div` horizontal zentrieren. You can do this by setting its `margin-left` and `margin-right` properties to `auto`. Think of the margin as invisible space around an element. Mit diesen beiden Rand-Eigenschaften zentrierst du das `div` Element innerhalb des `body` Elements. +Als nächstes möchtest du den `div` horizontal zentrieren. You can do this by setting its `margin-left` and `margin-right` properties to `auto`. Stelle dir den Rand als einen unsichtbaren Raum um ein Element herum vor. Mit diesen beiden Rand-Eigenschaften zentrierst du das `div` Element innerhalb des `body` Elements. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3cade99dda4e6071a85dfd.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3cade99dda4e6071a85dfd.md index 5447a57452b..a8b9f56a298 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3cade99dda4e6071a85dfd.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3cade99dda4e6071a85dfd.md @@ -7,7 +7,7 @@ dashedName: step-46 # --description-- -You will come back to styling the menu in a few steps, but for now, go ahead and add a second `section` element below the first for displaying the desserts offered by the cafe. +Du wirst in ein paar Schritten auf die Gestaltung der Speisekarte zurückkommen, aber füge jetzt ein zweites `section`-Element unterhalb des ersten hinzu, um die vom Café angebotenen Desserts anzuzeigen. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e03d719d5ac4738993.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e03d719d5ac4738993.md index 4865b361dad..2b644d532a1 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e03d719d5ac4738993.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e03d719d5ac4738993.md @@ -7,9 +7,9 @@ dashedName: step-56 # --description-- -Die aktuelle Breite der Speisekarte wird immer 80% der Breite des `body`-Elements beanspruchen. On a very wide screen, the coffee and dessert appear far apart from their prices. +Die aktuelle Breite der Speisekarte wird immer 80% der Breite des `body`-Elements beanspruchen. Auf einem sehr breiten Bildschirm erscheinen Kaffee und Dessert weit entfernt von ihren Preisen. -Add a `max-width` property to the `menu` class with a value of `500px` to prevent it from growing too wide. +Füge eine `max-width`-Eigenschaft mit einem Wert von `500px` der `menu`-Klasse hinzu, damit sie nicht zu breit wird. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e04559b939080db057.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e04559b939080db057.md index e0618af57b9..8f483fc304b 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e04559b939080db057.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e04559b939080db057.md @@ -42,7 +42,7 @@ const hasPadding = new __helpers.CSSHelp(document).getCSSRules().some(x => x.sty assert(hasPadding); ``` -Your `.menu` element should have a `padding` value of `20px`. +Dein `.menu`-Element sollte einen `padding`-Wert von `20px` haben. ```js const menuPadding = new __helpers.CSSHelp(document).getStyle('.menu')?.getPropertyValue('padding'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e050279c7a4a7101d3.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e050279c7a4a7101d3.md index d18900531d9..704c5ec3794 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e050279c7a4a7101d3.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e050279c7a4a7101d3.md @@ -7,7 +7,7 @@ dashedName: step-54 # --description-- -Das sieht besser aus. Now try to add the same `20px` padding to the top and bottom of the menu. +Das sieht besser aus. Versuche nun, das gleiche `20px`-Padding oberhalb und unterhalb der Speisekarte einzufügen. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e056bdde6ae6892ba2.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e056bdde6ae6892ba2.md index 2ae2f3473ed..42a5c8720d9 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e056bdde6ae6892ba2.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e056bdde6ae6892ba2.md @@ -7,9 +7,9 @@ dashedName: step-58 # --description-- -Es ist ein bisschen langweilig, dass alle Texte in der gleichen `font-family` sind. You can still have the majority of the text `sans-serif` and make just the `h1` and `h2` elements different using a different selector. +Es ist ein bisschen langweilig, dass alle Texte in der gleichen `font-family` sind. Du kannst trotzdem den Großteil des Textes `sans-serif` formatieren und nur die `h1`- und `h2`-Elemente mit einem anderen Selektor versehen. -Style both the `h1` and the `h2` elements so that only these elements' text use `Impact` font. +Formatiere beide `h1`- und `h2`-Elemente so, dass nur die Texte dieser Elemente die `Impact`-Schriftart verwenden. # --hints-- @@ -20,7 +20,7 @@ const h1h2Selector = new __helpers.CSSHelp(document).getStyle('h1, h2'); assert(h1h2Selector); ``` -You should set the `font-family` to `Impact`. +Du solltest `font-family` auf `Impact` setzen. ```js const hasFontFamily = new __helpers.CSSHelp(document).getCSSRules().some(x => x.style['font-family'] === 'Impact'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e07276f782bb46b93d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e07276f782bb46b93d.md index c138aa127b6..e43de1de9ab 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e07276f782bb46b93d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e07276f782bb46b93d.md @@ -7,29 +7,29 @@ dashedName: step-63 # --description-- -Add a `footer` element below the `main` element, where you can add some additional information. +Füge ein `footer`-Element unterhalb des `main`-Elements ein. In dieses Element kannst du zusätzliche Informationen eintragen. # --hints-- -You should have an opening `<footer>` tag. +Du solltest ein öffnendes `<footer>`-Tag haben. ```js assert(code.match(/<footer>/i)); ``` -You should have a closing `</footer>` tag. +Du solltest ein schließendes `</footer>`-Tag haben. ```js assert(code.match(/<\/footer>/i)); ``` -You should not modify the existing `main` element. +Du solltest nicht das vorhandene `main`-Element ändern. ```js assert($('main').length === 1); ``` -Your `footer` element should be below your `main` element. +Dein `footer`-Element sollte unterhalb deines `main`-Elements stehen. ```js const footer = $('footer')[0] diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0819d4f23ca7285e6.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0819d4f23ca7285e6.md index c2473b01604..7a812145e6f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0819d4f23ca7285e6.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0819d4f23ca7285e6.md @@ -7,11 +7,11 @@ dashedName: step-48 # --description-- -Add an empty `article` element under the `Desserts` heading. Give it a `class` attribute with the value `item`. +Füge ein leeres `article`-Element unter der `Desserts`-Überschrift ein. Gib diesem ein `class`-Attribut mit dem Wert `item`. # --hints-- -You should not change your existing `h2` element. +Du solltest nicht das vorhandene `h2`-Element abändern. ```js assert($('h2').length === 2); @@ -23,7 +23,7 @@ Dein `article`-Element sollte unter deinem `h2`-Element stehen. assert($('section')[1].children[1].tagName === 'ARTICLE'); ``` -Your new `article` element should have the `item` class. +Dein neues `article`-Element sollte über die Klasse `item` verfügen. ```js assert($('section')[1].children[1].className === 'item'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0b431cc215bb16f55.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0b431cc215bb16f55.md index 06af6f4c5bc..286677091a0 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0b431cc215bb16f55.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0b431cc215bb16f55.md @@ -1,6 +1,6 @@ --- id: 5f3ef6e0b431cc215bb16f55 -title: Step 65 +title: Schritt 65 challengeType: 0 dashedName: step-65 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0e0c3feaebcf647ad.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0e0c3feaebcf647ad.md index 65a7d6d7082..eede72db68f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0e0c3feaebcf647ad.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3ef6e0e0c3feaebcf647ad.md @@ -1,6 +1,6 @@ --- id: 5f3ef6e0e0c3feaebcf647ad -title: Step 47 +title: Schritt 47 challengeType: 0 dashedName: step-47 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3f26fa39591db45e5cd7a0.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3f26fa39591db45e5cd7a0.md index 06d5ff93212..94e23992f17 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3f26fa39591db45e5cd7a0.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f3f26fa39591db45e5cd7a0.md @@ -7,7 +7,7 @@ dashedName: step-67 # --description-- -The default properties of an `hr` element will make it appear as a thin light grey line. Du kannst die Höhe der Zeile ändern, indem du einen Wert für die `height`-Eigenschaft angibst. +Die Standardeinstellungen eines `hr`-Elements lassen es als dünne, graue Linie erscheinen. Du kannst die Höhe der Zeile ändern, indem du einen Wert für die `height`-Eigenschaft angibst. Ändere die Höhe des `hr`-Elements auf `3px`. @@ -27,7 +27,7 @@ const hasHeight = new __helpers.CSSHelp(document).getCSSRules().some(x => x.styl assert(hasHeight); ``` -Your `hr` element should have a height of `3px`. +Dein `hr`-Element sollte eine Höhe von `3px` haben. ```js const hrHeight = new __helpers.CSSHelp(document).getStyle('hr')?.getPropertyValue('height'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f459fd48bdc98491ca6d1a3.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f459fd48bdc98491ca6d1a3.md index 92351fd8f26..c3a4b8ecf83 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f459fd48bdc98491ca6d1a3.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f459fd48bdc98491ca6d1a3.md @@ -7,7 +7,7 @@ dashedName: step-71 # --description-- -Go ahead and add another `hr` element between the `main` element and the `footer` element. +Füge ein weiteres `hr`-Element zwischen dem `main`-Element und dem `footer`-Element hinzu. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f45a5a7c49a8251f0bdb527.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f45a5a7c49a8251f0bdb527.md index eaa409df79e..d1ccff186c3 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f45a5a7c49a8251f0bdb527.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f45a5a7c49a8251f0bdb527.md @@ -7,7 +7,7 @@ dashedName: step-74 # --description-- -Using the same style selector in the previous step, make the font size of the items and prices larger by using a value of `18px`. +Verwende den gleichen Stil-Selektor wie im vorherigen Schritt, um die Schriftgröße der Artikel und Preise zu vergrößern, indem du einen Wert von `18px` verwendest. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f45b4c81cea7763550e40df.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f45b4c81cea7763550e40df.md index 399884599a7..9cbc0e5d3b5 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f45b4c81cea7763550e40df.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f45b4c81cea7763550e40df.md @@ -1,6 +1,6 @@ --- id: 5f45b4c81cea7763550e40df -title: Step 83 +title: Schritt 83 challengeType: 0 dashedName: step-83 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f716ad029ee4053c7027a7a.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f716ad029ee4053c7027a7a.md index 816fc75b2f8..8f0046c3c34 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f716ad029ee4053c7027a7a.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f716ad029ee4053c7027a7a.md @@ -7,11 +7,11 @@ dashedName: step-49 # --description-- -Verschachtel zwei `p` Elemente in deinem `article` Element. The first one's text should be `Donut`, and the second's text `1.50`. Schreibe beide in dieselbe Zeile und achte darauf, dass kein Abstand dazwischen ist. +Verschachtel zwei `p` Elemente in deinem `article` Element. Der erste Text sollte `Donut` und der zweite Text `1.50` lauten. Schreibe beide in dieselbe Zeile und achte darauf, dass kein Abstand dazwischen ist. # --hints-- -You should not change your existing `article` element. +Du solltest das vorhandene `article`-Element nicht verändern. ```js assert($('article').length === 6); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f769541be494f25449b292f.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f769541be494f25449b292f.md index 8eb496736c6..cda8158cc59 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f769541be494f25449b292f.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-basic-css-by-building-a-cafe-menu/5f769541be494f25449b292f.md @@ -1,6 +1,6 @@ --- id: 5f769541be494f25449b292f -title: Step 33 +title: Schritt 33 challengeType: 0 dashedName: step-33 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6140de31b1f5b420410728ff.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6140de31b1f5b420410728ff.md index 52325486759..d398ac38afa 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6140de31b1f5b420410728ff.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6140de31b1f5b420410728ff.md @@ -7,11 +7,11 @@ dashedName: step-19 # --description-- -Now give the `@keyframes wheel` rule a `100%` selector. Within that, set the `transform` to `rotate(360deg)`. By doing this, your animation will now complete a full rotation. +Gib der `@keyframes wheel`-Regel einen `100%`-Selektor. Darin setzt du `transform` auf `rotate(360deg)`. Damit wird deine Animation nun eine komplette Rotation durchführen. # --hints-- -Your `@keyframes wheel` rule should have a `100%` selector. +Deine `@keyframes wheel`-Regel sollte einen `100%`-Selektor haben. ```js const rules = new __helpers.CSSHelp(document).getCSSRules('keyframes')?.[0]?.cssRules diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6140f4b5c1555a2960de1e5f.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6140f4b5c1555a2960de1e5f.md index 9797d226a72..37c9cf16b92 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6140f4b5c1555a2960de1e5f.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6140f4b5c1555a2960de1e5f.md @@ -11,13 +11,13 @@ Create another `@keyframes` rule with the name `cabins`. Use the same properties # --hints-- -You should have a `@keyframes` rule. +Du solltest eine `@keyframes`-Regel haben. ```js assert(new __helpers.CSSHelp(document).getCSSRules('keyframes')?.length === 2); ``` -Your new `@keyframes` rule should be named `cabins`. +Deine neue `@keyframes`-Regel sollte `cabins` heißen. ```js const rules = new __helpers.CSSHelp(document).getCSSRules('keyframes'); @@ -30,25 +30,25 @@ Your new `@keyframes` rule should come after your `@keyframes wheel` rule. assert(new __helpers.CSSHelp(document).getCSSRules('keyframes')?.[1]?.name === 'cabins'); ``` -You should not change the name of your `@keyframes wheel` rule. +Du solltest den Namen deiner `@keyframes wheel`-Regel nicht ändern. ```js assert(new __helpers.CSSHelp(document).getCSSRules('keyframes')?.[0]?.name === 'wheel'); ``` -Your `@keyframes cabins` rule should have a `0%` selector. +Deine `@keyframes cabins`-Regel sollte einen `0%`-Selektor haben. ```js assert(new __helpers.CSSHelp(document).getCSSRules('keyframes')?.[1]?.cssRules?.[0]?.keyText === '0%'); ``` -Your `0%` selector should have a `transform` property set to `rotate(0deg)`. +Dein `0%`-Selektor sollte eine `transform`-Eigenschaft von `rotate(0deg)` haben. ```js assert(new __helpers.CSSHelp(document).getCSSRules('keyframes')?.[1]?.cssRules?.[0]?.style?.transform === 'rotate(0deg)'); ``` -Your `@keyframes cabins` rule should have a `100%` selector. +Deine `@keyframes cabins`-Regel sollte einen `100%`-Selektor haben. ```js const rules = new __helpers.CSSHelp(document).getCSSRules('keyframes')?.[1]?.cssRules @@ -61,7 +61,7 @@ Your `100%` selector should come after your `0%` selector. assert(new __helpers.CSSHelp(document).getCSSRules('keyframes')?.[1]?.cssRules?.[1]?.keyText === '100%') ``` -Your `100%` selector should have a `transform` property set to `rotate(-360deg)`. +Dein `100%`-Selektor sollte eine `transform`-Eigenschaft von `rotate(-360deg)` haben. ```js assert(new __helpers.CSSHelp(document).getCSSRules('keyframes')?.[1]?.cssRules?.[1]?.style?.transform === 'rotate(-360deg)') diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6141026ec9882f2d39dcf2b8.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6141026ec9882f2d39dcf2b8.md index 6dc6a1be960..97f879a7da4 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6141026ec9882f2d39dcf2b8.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6141026ec9882f2d39dcf2b8.md @@ -1,6 +1,6 @@ --- id: 6141026ec9882f2d39dcf2b8 -title: Step 26 +title: Schritt 26 challengeType: 0 dashedName: step-26 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6169b284950e171d8d0bb16a.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6169b284950e171d8d0bb16a.md index 387663ae25b..1f42efe7b75 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6169b284950e171d8d0bb16a.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-animation-by-building-a-ferris-wheel/6169b284950e171d8d0bb16a.md @@ -7,7 +7,7 @@ dashedName: step-29 # --description-- -Finally, create a new `75%` selector between your `50%` and `100%` selectors. Give this new selector a `background-color` property set to `yellow`. +Finally, create a new `75%` selector between your `50%` and `100%` selectors. Gib diesem neuen Selektor eine `background-color` Eigenschaft von `yellow`. Damit ist deine Animation viel flüssiger und dein Ferris-Wheel komplett. diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/616d595270d902f0e7086e18.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/616d595270d902f0e7086e18.md index 9e0fda68dde..d6953a4ddfb 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/616d595270d902f0e7086e18.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/616d595270d902f0e7086e18.md @@ -1,6 +1,6 @@ --- id: 616d595270d902f0e7086e18 -title: Step 15 +title: Schritt 15 challengeType: 0 dashedName: step-15 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/619b74fa777a2b2473c94f82.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/619b74fa777a2b2473c94f82.md index b34ad6ca35b..a35e34889a2 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/619b74fa777a2b2473c94f82.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/619b74fa777a2b2473c94f82.md @@ -1,6 +1,6 @@ --- id: 619b74fa777a2b2473c94f82 -title: Step 45 +title: Schritt 45 challengeType: 0 dashedName: step-45 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61a5c906ab73313316e342f0.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61a5c906ab73313316e342f0.md index fd4c58c74d3..f88b187cbe0 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61a5c906ab73313316e342f0.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61a5c906ab73313316e342f0.md @@ -1,6 +1,6 @@ --- id: 61a5c906ab73313316e342f0 -title: Step 65 +title: Schritt 65 challengeType: 0 dashedName: step-65 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61a5ca57f50ded36d33eef96.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61a5ca57f50ded36d33eef96.md index 66bf66e3953..bb64aef94d8 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61a5ca57f50ded36d33eef96.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61a5ca57f50ded36d33eef96.md @@ -1,6 +1,6 @@ --- id: 61a5ca57f50ded36d33eef96 -title: Step 66 +title: Schritt 66 challengeType: 0 dashedName: step-66 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61adc60b69cd4b87739d2174.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61adc60b69cd4b87739d2174.md index 785fe4028ed..7ba305f0db8 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61adc60b69cd4b87739d2174.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61adc60b69cd4b87739d2174.md @@ -1,6 +1,6 @@ --- id: 61adc60b69cd4b87739d2174 -title: Step 71 +title: Schritt 71 challengeType: 0 dashedName: step-71 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61addaf7e83988b59a7d18ff.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61addaf7e83988b59a7d18ff.md index 68da86499e6..bfe3e119d25 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61addaf7e83988b59a7d18ff.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61addaf7e83988b59a7d18ff.md @@ -1,6 +1,6 @@ --- id: 61addaf7e83988b59a7d18ff -title: Step 82 +title: Schritt 82 challengeType: 0 dashedName: step-82 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537485c4f2a624f18d7794.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537485c4f2a624f18d7794.md index 850ac54b218..224c8e23574 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537485c4f2a624f18d7794.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537485c4f2a624f18d7794.md @@ -7,19 +7,19 @@ dashedName: step-1 # --description-- -Begin with your standard HTML boilerplate. Add a `DOCTYPE` declaration, an `html` element, a `head` element, and a `body` element. +Beginne mit deinem standardmäßigen HTML-Boilerplate-Code. Füge eine `DOCTYPE`-Deklaration, ein `html`-Element, ein `head`-Element und ein `body`-Element hinzu. Add the `lang` attribute to the opening `<html>` tag with `en` set as the value. # --hints-- -Your code should contain the `DOCTYPE` reference. +Dein Code sollte die `DOCTYPE`-Referenz beinhalten. ```js assert(code.match(/<!DOCTYPE/gi)); ``` -You should include a space after the `DOCTYPE` reference. +Du solltest nach der `DOCTYPE`-Referenz ein Leerzeichen einfügen. ```js assert(code.match(/<!DOCTYPE\s+/gi)); @@ -31,19 +31,19 @@ You should define `html` as the document type. assert(code.match(/<!DOCTYPE\s+html/gi)); ``` -You should close the `DOCTYPE` declaration with a `>` after the type. +Du solltest die `DOCTYPE`-Deklaration mit einem `>` nach dem Typ schließen. ```js assert(code.match(/<!DOCTYPE\s+html\s*>/gi)); ``` -Your `html` element should have an opening tag. +Dein `html`-Element sollte ein öffnendes Tag haben. ```js assert(code.match(/<html\s*>|<html\s+lang\s*=\s*('|")en\1\s*>/gi)); ``` -Your `html` element should have a closing tag. +Dein `html`-Element sollte ein schließendes Tag haben. ```js assert(code.match(/<\/html\s*>/)); @@ -55,19 +55,19 @@ Your opening `<html>` tag should have the `lang` attribute with `en` as the valu assert(code.match(/<html\s+lang\s*=\s*('|")en\1\s*>/)); ``` -Your `DOCTYPE` declaration should be at the beginning of your HTML. +Deine `DOCTYPE`-Deklaration sollte am Anfang deines HTML stehen. ```js assert(__helpers.removeHtmlComments(code).match(/^\s*<!DOCTYPE\s+html\s*>/i)); ``` -You should have an opening `head` tag. +Du solltest ein öffnendes `head`-Tag haben. ```js assert(code.match(/<head\s*>/i)); ``` -You should have a closing `head` tag. +Du solltest ein schließendes `head`-Tag haben. ```js assert(code.match(/<\/head\s*>/i)); @@ -79,25 +79,25 @@ You should have an opening `body` tag. assert(code.match(/<body\s*>/i)); ``` -You should have a closing `body` tag. +Du solltest ein schließendes `body`-Tag haben. ```js assert(code.match(/<\/body\s*>/i)); ``` -The `head` and `body` elements should be siblings. +Das `head`- und `body`-Element sollten Geschwister sein. ```js assert(document.querySelector('head')?.nextElementSibling?.localName === 'body'); ``` -The `head` element should be within the `html` element. +Das `head`-Element sollte sich innerhalb des `html`-Elements befinden. ```js assert([...document.querySelector('html')?.children].some(x => x?.localName === 'head')); ``` -The `body` element should be within the `html` element. +Das `body`-Element sollte sich innerhalb des `html`-Elements befinden. ```js assert([...document.querySelector('html')?.children].some(x => x?.localName === 'body')); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537a8054753e2f1f2a1574.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537a8054753e2f1f2a1574.md index dc11e86aded..797f715ffe8 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537a8054753e2f1f2a1574.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537a8054753e2f1f2a1574.md @@ -9,18 +9,18 @@ dashedName: step-2 Within your `head` element, add a `meta` tag with the `name` set to `viewport` and the `content` set to `width=device-width, initial-scale=1`. -Also add a `meta` tag with the `charset` set to `UTF-8`. +Füge ebenfalls ein `meta`-Tag mit dem `charset` von `UTF-8` hinzu. # --hints-- -You should have two `meta` elements. +Du solltest zwei `meta`-Elemente haben. ```js const meta = document.querySelectorAll('meta'); assert(meta?.length === 2); ``` -One `meta` element should have a `name` set to `viewport`, and `content` set to `width=device-width, initial-scale=1.0`. +Dein `meta`-Element sollte einen `name` auf `viewport` und `content` auf `width=device-width, initial-scale=1.0` gesetzt haben. ```js const meta = [...document.querySelectorAll('meta')]; @@ -28,7 +28,7 @@ const target = meta?.find(m => m?.getAttribute('name') === 'viewport' && m?.getA assert.exists(target); ``` -Your other `meta` element should have the `charset` attribute set to `UTF-8`. +Dein anderes `meta`-Element sollte das `charset`-Attribut auf `UTF-8` gesetzt haben. ```js const meta = [...document.querySelectorAll('meta')]; diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537c5f81f0cf325b4a854c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537c5f81f0cf325b4a854c.md index 55a815178bb..1728520622b 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537c5f81f0cf325b4a854c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537c5f81f0cf325b4a854c.md @@ -7,13 +7,13 @@ dashedName: step-4 # --description-- -Add a `header` element within the `body` element and assign a class of `header` to it. +Füge ein `header`-Element innerhalb des `body`-Elements hinzu und weise ihm eine Klasse von `header` zu. Erstelle im `header` einen `h1` mit `css flexbox photo gallery` als Text. # --hints-- -You should have a `header` element within your `body` element. +Du solltest ein `header`-Element innerhalb deines `body`-Elements haben. ```js assert.exists(document.querySelector('body')?.querySelector('header')); @@ -25,13 +25,13 @@ Your `header` element should have a `class` with `header` as the value. assert(document?.querySelector('body')?.querySelector('header')?.classList?.contains('header')); ``` -Your `header` element should have an `h1` element inside it. +Dein `header`-Element sollte ein `h1`-Element haben. ```js assert.exists(document.querySelector('.header')?.querySelector('h1')); ``` -Your `h1` element should have the text `css flexbox photo gallery` inside it. +Dein `h1`-Element sollte den Text `css flexbox photo gallery` haben. ```js assert(document?.querySelector('.header')?.querySelector('h1')?.innerText === 'css flexbox photo gallery'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537c9eecea6a335db6da79.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537c9eecea6a335db6da79.md index 2d946223cb7..fd62bcc185f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537c9eecea6a335db6da79.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537c9eecea6a335db6da79.md @@ -9,11 +9,11 @@ dashedName: step-5 Below your `.header` element, create a new `div` element and assign it a `class` of `gallery`. Dieses `div`-Element dient als Container für die Galeriebilder. -Inside that `.gallery` element, create nine `img` elements. +Erstelle innerhalb deines `.gallery`-Elements neun `img`-Elemente. # --hints-- -You should create a `div` element in your `body` element. +Du solltest ein `div`-Element in deinem `body`-Element erstellen. ```js assert(document.querySelector('body')?.querySelectorAll('div')?.length >= 1); @@ -31,7 +31,7 @@ Your new `div` element should come after your `.header` element. assert(document.querySelector('header')?.nextElementSibling?.classList?.contains('gallery')); ``` -Your `.gallery` element should have nine `img` elements. +Dein `.gallery`-Element sollte neun `img`-Elemente haben. ```js assert(document.querySelector('.gallery')?.querySelectorAll('img')?.length === 9); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537d86bdc3dd343688fceb.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537d86bdc3dd343688fceb.md index 507f9a76d2b..0e6193e2338 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537d86bdc3dd343688fceb.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61537d86bdc3dd343688fceb.md @@ -7,11 +7,11 @@ dashedName: step-6 # --description-- -Next, give each `img` a `src` attribute according to its order in the document. The first `img` should have a `src` of `https://cdn.freecodecamp.org/curriculum/css-photo-gallery/1.jpg`. The rest should be the same, except replace the `1` with the number the `img` is in the document. +Gib als Nächstes jedem `img` ein `src`-Attribut entsprechend seiner Reihenfolge im Dokument. The first `img` should have a `src` of `https://cdn.freecodecamp.org/curriculum/css-photo-gallery/1.jpg`. The rest should be the same, except replace the `1` with the number the `img` is in the document. # --hints-- -All nine of your `img` elements should have a `src` attribute. +Alle neun der `img`-Elemente sollten ein `src`-Attribut haben. ```js const images = [...document.querySelectorAll('img')]; diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/615380dff67172357fcf0425.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/615380dff67172357fcf0425.md index c83621cd5fa..9bb4cdf1c63 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/615380dff67172357fcf0425.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/615380dff67172357fcf0425.md @@ -11,7 +11,7 @@ Normalize your box model by creating a `*` selector and setting the `box-sizing` # --hints-- -You should have a `*` selector. +Du solltest einen `*`-Selektor haben. ```js assert.exists(new __helpers.CSSHelp(document).getStyle('*')); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153893900438b4643590367.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153893900438b4643590367.md index 43bdfcbebcc..36be8724ed3 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153893900438b4643590367.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153893900438b4643590367.md @@ -11,7 +11,7 @@ Remove the margin from your `body` element, set the `font-family` to `sans-serif # --hints-- -You should have a `body` selector. +Du solltest einen `body`-Selektor haben. ```js assert.exists(new __helpers.CSSHelp(document).getStyle('body')); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153908a366afb4d57185c8d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153908a366afb4d57185c8d.md index 18ee8fed3e8..89592686682 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153908a366afb4d57185c8d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153908a366afb4d57185c8d.md @@ -1,6 +1,6 @@ --- id: 6153908a366afb4d57185c8d -title: Step 12 +title: Schritt 12 challengeType: 0 dashedName: step-12 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153947986535e5117e60615.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153947986535e5117e60615.md index 22d7937733c..ec822bfec68 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153947986535e5117e60615.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153947986535e5117e60615.md @@ -7,13 +7,13 @@ dashedName: step-15 # --description-- -The `align-items` property positions the flex content along the cross axis. Wenn deine `flex-direction` auf `row` gesetzt ist, wäre deine Querachse in diesem Fall vertikal. +Die `align-items`-Eigenschaft positioniert den Flex-Inhalt an der Querachse. Wenn deine `flex-direction` auf `row` gesetzt ist, wäre deine Querachse in diesem Fall vertikal. -To vertically center your images, give your `.gallery` selector an `align-items` property with `center` as the value. +Gib deinem `.gallery`-Selektor eine `align-items`-Eigenschaft mit `center` als Wert, um deine Bilder vertikal zu zentrieren. # --hints-- -Your `.gallery` selector should have an `align-items` property set to `center` as the value. +Dein `.gallery`-Selektor sollte eine `align-items`-Eigenschaft von `center` als Wert haben. ```js assert(new __helpers.CSSHelp(document).getStyle('.gallery')?.alignItems === 'center'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61539f32a206bd53ec116465.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61539f32a206bd53ec116465.md index d7bdb6e7a97..6d0e7551fab 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61539f32a206bd53ec116465.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/61539f32a206bd53ec116465.md @@ -7,9 +7,9 @@ dashedName: step-17 # --description-- -Beachte, dass einige deiner Bilder verzerrt sind. Das liegt daran, dass die Bilder verschiedene Seitenverhältnisse haben. Rather than setting each aspect ratio individually, you can use the `object-fit` property to determine how images should behave. +Beachte, dass einige deiner Bilder verzerrt sind. Das liegt daran, dass die Bilder verschiedene Seitenverhältnisse haben. Statt jedes Seitenverhältnis einzeln anzupassen, kannst du die `object-fit`-Eigenschaft verwenden, um zu bestimmen, wie Bilder sich verhalten sollten. -Give your `.gallery img` selector the `object-fit` property and set it to `cover`. This will tell the image to fill the `img` container while maintaining aspect ratio, resulting in cropping to fit. +Give your `.gallery img` selector the `object-fit` property and set it to `cover`. Dadurch wird dem Bild angewiesen den `img`-Container zu füllen, während das Seitenverhältnis beibehalten wird. Dies führt dazu, dass das Bild passend zugeschnitten wird. # --hints-- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153a3485f0b20591d26d2a1.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153a3485f0b20591d26d2a1.md index f1ec2efa5c7..54547749c83 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153a3485f0b20591d26d2a1.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/6153a3485f0b20591d26d2a1.md @@ -1,6 +1,6 @@ --- id: 6153a3485f0b20591d26d2a1 -title: Step 19 +title: Schritt 19 challengeType: 0 dashedName: step-19 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/615f171d05def3218035dc85.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/615f171d05def3218035dc85.md index c92fa4f61ed..522b0d46f66 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/615f171d05def3218035dc85.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-flexbox-by-building-a-photo-gallery/615f171d05def3218035dc85.md @@ -1,6 +1,6 @@ --- id: 615f171d05def3218035dc85 -title: Step 8 +title: Schritt 8 challengeType: 0 dashedName: step-8 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a1a228f7d068ab16a130.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a1a228f7d068ab16a130.md index d386fc088a3..340fa47cee0 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a1a228f7d068ab16a130.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a1a228f7d068ab16a130.md @@ -7,7 +7,7 @@ dashedName: step-15 # --description-- -Below your `blockquote` element, add another `p` element with the following text: +Füge unter deinem `blockquote`-Element ein weiteres `p`-Element mit dem folgenden Text hinzu: ```markup No more walls of explanatory text. No more walls of tests. Just one test at a time, as you build up a working project. Over the course of passing thousands of tests, you build up projects and your own understanding of coding fundamentals. There is no transition between lessons and projects, because the lessons themselves are baked into projects. And there's plenty of repetition to help you retain everything because - hey - building projects in real life has plenty of repetition. diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a73279ce6369de4b9bcc.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a73279ce6369de4b9bcc.md index 905b5ec4fbc..27b213108cd 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a73279ce6369de4b9bcc.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a73279ce6369de4b9bcc.md @@ -15,7 +15,7 @@ The main design challenge is taking what is currently paragraphs of explanation # --hints-- -You should add a fifth `p` element. +Du solltest ein fünftes `p`-Element hinzufügen. ```js assert(document.querySelectorAll('.text p')?.length === 6); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a778bffc206ac6b1dbe3.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a778bffc206ac6b1dbe3.md index e10f573aff8..c3b443e89df 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a778bffc206ac6b1dbe3.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a778bffc206ac6b1dbe3.md @@ -7,7 +7,7 @@ dashedName: step-17 # --description-- -Create one final `p` element at the end of your `.text` element and give it the following text: +Erstelle am Ende deines `.text`-Elements ein letztes `p`-Element und gib ihm den folgenden Text: ```markup Instead of a series of coding challenges, people will be in their code @@ -20,7 +20,7 @@ the beginning. And freeCodeCamp will be a much smoother experience. # --hints-- -You should add a sixth `p` element to the `.text` element. +Du solltest ein sechstes `p`-Element zu dem `.text`-Element hinzufügen. ```js assert(document.querySelectorAll('.text p')?.length === 7) diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a83fcc32c26bcfae3efa.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a83fcc32c26bcfae3efa.md index fe518f26ffc..d99583688bb 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a83fcc32c26bcfae3efa.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143a83fcc32c26bcfae3efa.md @@ -7,53 +7,53 @@ dashedName: step-18 # --description-- -Below your `.text` element, create a new `section` element and give it a `class` of `text text-with-images`. Within that, create an `article` element with a `class` set to `brief-history`, and an `aside` element with the `class` set to `image-wrapper`. +Erstelle unter deinem `.text`-Element ein neues `section`-Element und gib ihm eine `class` von `text text-with-images`. Within that, create an `article` element with a `class` set to `brief-history`, and an `aside` element with the `class` set to `image-wrapper`. # --hints-- -You should create a new `section` element. +Du solltest ein neues `section`-Element erstellen. ```js assert(document.querySelectorAll('section')?.length === 3) ``` -Your new `section` element should come after your `.text` element. +Dein neues `section`-Element sollte nach deinem `.text`-Element stehen. ```js assert(document.querySelectorAll('section')?.[2]?.previousElementSibling?.className === 'text') ``` -Your new `section` element should have the `class` set to `text text-with-images`. +Dein neues `section`-Element sollte die `class` auf `text text-with-images` gesetzt haben. ```js assert(document.querySelectorAll('section')?.[2]?.className === 'text text-with-images') ``` -Your new `section` element should have an `article` element. +Dein neues `section`-Element sollte ein `article`-Element haben. ```js assert.exists(document.querySelector('.text-with-images article')); ``` -Your new `section` element should have an `aside` element. +Dein neues `section`-Element sollte ein `aside`-Element haben. ```js assert.exists(document.querySelector('.text-with-images aside')); ``` -The `article` element should come before the `aside` element. +Dein `article`-Element sollte vor dem `aside`-Element stehen. ```js assert(document.querySelector('.text-with-images article')?.nextElementSibling?.localName === 'aside'); ``` -Your `article` element should have the `class` set to `brief-history`. +Dein `article`-Element sollte die `class` auf `brief-history` gesetzt haben. ```js assert(document.querySelector('.text-with-images article')?.className === 'brief-history'); ``` -Your `aside` element should have the `class` set to `image-wrapper`. +Dein `aside`-Element sollte die `class` auf `image-wrapper` gesetzt haben. ```js assert(document.querySelector('.text-with-images aside')?.className === 'image-wrapper'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143b97c06c3306d23d5da47.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143b97c06c3306d23d5da47.md index 19e63f2e049..213d3104518 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143b97c06c3306d23d5da47.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143b97c06c3306d23d5da47.md @@ -7,29 +7,29 @@ dashedName: step-19 # --description-- -Within your `article` element, create an `h3` element with the `class` set to `list-title` and the text of `A Brief History`. Below that, create a `p` element with the text `Of the Curriculum`. Erstelle dann ein `ul` mit der Klasse `lists`. +Erstelle, innerhalb eines `article`-Elements, ein `h3`-Element mit der `class` von `list-title` und dem Text `A Brief History`. Erstelle darunter ein `p`-Element mit dem Text `Of the Curriculum`. Erstelle dann ein `ul` mit der Klasse `lists`. # --hints-- -You should create an `h3` element within your `article` element. +Du solltest ein `h3`-Element innerhalb deines `article`-Elements erstellen. ```js assert.exists(document.querySelector('article h3')); ``` -You should create a `p` element within your `article` element. +Du solltest ein `p`-Element innerhalb deines `article`-Elements erstellen. ```js assert.exists(document.querySelector('article p')); ``` -You should create a `ul` element within your `article` element. +Du solltest ein `ul`-Element innerhalb deines `article`-Elements erstellen. ```js assert.exists(document.querySelector('article ul')); ``` -Your elements within the `article` element should be in the correct order. +Deine Elemente innerhalb deines `article`-Elements sollten in der richtigen Reihenfolge sein. ```js const children = document.querySelector('article')?.children; @@ -38,7 +38,7 @@ assert(children?.[1]?.localName === 'p'); assert(children?.[2]?.localName === 'ul'); ``` -Your new `h3` element should have the `class` set to `list-title`. +Dein neues `h3`-Element sollte die `class` von `list-title` haben. ```js assert(document.querySelector('article h3')?.className === 'list-title'); @@ -50,7 +50,7 @@ Dein neues `h3`-Element sollte den Text `A Brief History` haben. assert(document.querySelector('article h3')?.innerText === 'A Brief History'); ``` -Your new `p` element should have the text of `Of the Curriculum`. +Dein neues `p`-Element sollte den Text `Of the Curriculum` haben. ```js assert(document.querySelector('article p')?.innerText === 'Of the Curriculum'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143b9e1f5035c6e5f2a8231.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143b9e1f5035c6e5f2a8231.md index 4444a6f1952..38521482395 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143b9e1f5035c6e5f2a8231.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143b9e1f5035c6e5f2a8231.md @@ -7,7 +7,7 @@ dashedName: step-20 # --description-- -Within your `ul` element, create six `li` elements. Add an `h4` element with a `class` set to `list-subtitle` and a `p` element to each of your `li` elements. +Erstelle innerhalb deines `ul`-Elements sechs `li`-Elemente. Füge ein `h4`-Element mit einer `class` von `list-subtitle` und ein `p`-Element zu jedem deiner `li`-Elemente hinzu. Gib dann den `h4`- und `p`-Elementen in Reihenfolge den folgenden Textinhalt, wobei jedes `h4`-Element das aufnimmt, was auf der linken Seite des Doppelpunkts steht und jedes `p`-Element das, was auf der rechten Seite steht: @@ -20,13 +20,13 @@ Gib dann den `h4`- und `p`-Elementen in Reihenfolge den folgenden Textinhalt, wo # --hints-- -Your `ul` element should have six `li` elements. +Dein `ul`-Element sollte sechs `li`-Elemente haben. ```js assert(document.querySelectorAll('.lists li')?.length === 6); ``` -Each of your new `li` elements should have an `h4` and `p` element. +Jedes deiner neuen `li`-Elemente sollte ein `h4`- und ein `p`-Element haben. ```js const lis = [...document.querySelectorAll('.lists li')]; @@ -51,7 +51,7 @@ Dein zweites `h4` sollte den Text `V2 - 2015` haben. assert(document.querySelectorAll('.lists li h4')?.[1]?.innerText === 'V2 - 2015'); ``` -Your second `p` should have the text `We added interactive algorithm challenges.` +Dein zweites `p` sollte den Text `We added interactive algorithm challenges.` haben. ```js assert(document.querySelectorAll('.lists li p')?.[1]?.innerText === 'We added interactive algorithm challenges.'); @@ -63,7 +63,7 @@ Dein drittes `h4` sollte den Text `V3 - 2015` haben. assert(document.querySelectorAll('.lists li h4')?.[2]?.innerText === 'V3 - 2015'); ``` -Your third `p` should have the text `We added our own HTML+CSS challenges (before we'd been relying on General Assembly's Dash course for these).` +Dein drittes `p` sollte den Text `We added our own HTML+CSS challenges (before we'd been relying on General Assembly's Dash course for these).` haben. ```js assert(document.querySelectorAll('.lists li p')?.[2]?.innerText === 'We added our own HTML+CSS challenges (before we\'d been relying on General Assembly\'s Dash course for these).'); @@ -87,7 +87,7 @@ Dein fünftes `h4` sollte den Text `V5 - 2017` haben. assert(document.querySelectorAll('.lists li h4')?.[4]?.innerText === 'V5 - 2017'); ``` -Your fifth `p` should have the text `We added the back end and data visualization challenges.` +Dein fünftes `p` sollte den Text `We added the back end and data visualization challenges.` haben. ```js assert(document.querySelectorAll('.lists li p')?.[4]?.innerText === 'We added the back end and data visualization challenges.'); @@ -99,13 +99,13 @@ Dein sechstes `h4` sollte den Text `V6 - 2018` haben. assert(document.querySelectorAll('.lists li h4')?.[5]?.innerText === 'V6 - 2018'); ``` -Your sixth `p` should have the text `We launched 6 new certifications to replace our old ones. This was the biggest curriculum improvement to date.` +Dein sechstes `p` sollte den Text `We launched 6 new certifications to replace our old ones. This was the biggest curriculum improvement to date.` haben. ```js assert(document.querySelectorAll('.lists li p')?.[5]?.innerText === 'We launched 6 new certifications to replace our old ones. This was the biggest curriculum improvement to date.'); ``` -Your six `h4` elements should each have the class `list-subtitle`. +Deine sechs `h4`-Elemente sollten die Klasse `list-subtitle` haben. ```js const h4s = [...document.querySelectorAll('.lists li h4')]; diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143cd08fe927072ca3a371d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143cd08fe927072ca3a371d.md index a6ed22bda56..fe464142d45 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143cd08fe927072ca3a371d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143cd08fe927072ca3a371d.md @@ -11,37 +11,37 @@ Within your `.image-wrapper` element, give the second `img` element a `src` of ` # --hints-- -Your second `img` element should have a `src` set to `https://cdn.freecodecamp.org/testable-projects-fcc/images/calc.png`. +Dein zweites `img`-Element sollte einen `src` von `https://cdn.freecodecamp.org/testable-projects-fcc/images/calc.png` haben. ```js assert(document.querySelectorAll('.image-wrapper img')?.[1]?.getAttribute('src') === 'https://cdn.freecodecamp.org/testable-projects-fcc/images/calc.png'); ``` -Your second `img` element should have an `alt` set to `image of a calculator project`. +Dein zweites `img`-Element sollte einen `alt` von `image of a calculator project` haben. ```js assert(document.querySelectorAll('.image-wrapper img')?.[1]?.getAttribute('alt') === 'image of a calculator project'); ``` -Your second `img` element should have a `loading` attribute set to `lazy`. +Dein zweites `img`-Element sollte ein `loading`-Attribut auf `lazy` gesetzt haben. ```js assert(document.querySelectorAll('.image-wrapper img')?.[1]?.getAttribute('loading') === 'lazy'); ``` -Your second `img` element should have a `class` set to `image-2`. +Dein zweites `img`-Element sollte eine `class` von `image-2` haben. ```js assert(document.querySelectorAll('.image-wrapper img')?.[1]?.classList?.contains('image-2')); ``` -Your second `img` element should have a `width` set to `400`. +Dein zweites `img`-Element sollte eine `width` von `400` haben. ```js assert(document.querySelectorAll('.image-wrapper img')?.[1]?.getAttribute('width') === '400'); ``` -Your second `img` element should have a `height` set to `400`. +Dein zweites `img`-Element sollte eine `height` von `400` haben. ```js assert(document.querySelectorAll('.image-wrapper img')?.[1]?.getAttribute('height') === '400'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143d2842b497779bad947de.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143d2842b497779bad947de.md index 813ab28b826..cd54b3a6847 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143d2842b497779bad947de.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6143d2842b497779bad947de.md @@ -1,6 +1,6 @@ --- id: 6143d2842b497779bad947de -title: Step 26 +title: Schritt 26 challengeType: 0 dashedName: step-26 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148d4d57b965358c9fa38bf.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148d4d57b965358c9fa38bf.md index 16e04f302e7..e1bf0b167a6 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148d4d57b965358c9fa38bf.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148d4d57b965358c9fa38bf.md @@ -1,6 +1,6 @@ --- id: 6148d4d57b965358c9fa38bf -title: Step 65 +title: Schritt 65 challengeType: 0 dashedName: step-65 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148e246146b646cf4255f0c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148e246146b646cf4255f0c.md index e3a186c9466..481e21190b3 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148e246146b646cf4255f0c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148e246146b646cf4255f0c.md @@ -1,6 +1,6 @@ --- id: 6148e246146b646cf4255f0c -title: Step 71 +title: Schritt 71 challengeType: 0 dashedName: step-71 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148f693e0728f77c87f3020.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148f693e0728f77c87f3020.md index 056b0601cdf..b76fcad3094 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148f693e0728f77c87f3020.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/6148f693e0728f77c87f3020.md @@ -1,6 +1,6 @@ --- id: 6148f693e0728f77c87f3020 -title: Step 79 +title: Schritt 79 challengeType: 0 dashedName: step-79 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/614e0e503b110f76d3ac2ff6.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/614e0e503b110f76d3ac2ff6.md index 9ab32041475..c79f6caf856 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/614e0e503b110f76d3ac2ff6.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-grid-by-building-a-magazine/614e0e503b110f76d3ac2ff6.md @@ -1,6 +1,6 @@ --- id: 614e0e503b110f76d3ac2ff6 -title: Step 43 +title: Schritt 43 challengeType: 0 dashedName: step-43 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6196928658b6010f28c39484.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6196928658b6010f28c39484.md index afa5d6f94b8..8c661f93ec6 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6196928658b6010f28c39484.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6196928658b6010f28c39484.md @@ -1,6 +1,6 @@ --- id: 6196928658b6010f28c39484 -title: Step 8 +title: Schritt 8 challengeType: 0 dashedName: step-8 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6196d32d1340d829f0f6f57d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6196d32d1340d829f0f6f57d.md index f924e1d525c..b1df5478bdc 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6196d32d1340d829f0f6f57d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6196d32d1340d829f0f6f57d.md @@ -1,6 +1,6 @@ --- id: 6196d32d1340d829f0f6f57d -title: Step 26 +title: Schritt 26 challengeType: 0 dashedName: step-26 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d0fc9825c271253df28d4.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d0fc9825c271253df28d4.md index a346767374a..ef938d2ec70 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d0fc9825c271253df28d4.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d0fc9825c271253df28d4.md @@ -1,6 +1,6 @@ --- id: 619d0fc9825c271253df28d4 -title: Step 64 +title: Schritt 64 challengeType: 0 dashedName: step-64 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d1e7a8e81a61c5a819dc4.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d1e7a8e81a61c5a819dc4.md index e650139f7ec..d1577133bf8 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d1e7a8e81a61c5a819dc4.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d1e7a8e81a61c5a819dc4.md @@ -1,6 +1,6 @@ --- id: 619d1e7a8e81a61c5a819dc4 -title: Step 78 +title: Schritt 78 challengeType: 0 dashedName: step-78 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d204bd73ae51e743b8e94.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d204bd73ae51e743b8e94.md index e26cf4e13ac..0f297cb5e81 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d204bd73ae51e743b8e94.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d204bd73ae51e743b8e94.md @@ -1,6 +1,6 @@ --- id: 619d204bd73ae51e743b8e94 -title: Step 81 +title: Schritt 81 challengeType: 0 dashedName: step-81 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d3711d04d623000013e9e.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d3711d04d623000013e9e.md index c1d91556449..39cb5d294b2 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d3711d04d623000013e9e.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/619d3711d04d623000013e9e.md @@ -1,6 +1,6 @@ --- id: 619d3711d04d623000013e9e -title: Step 104 +title: Schritt 104 challengeType: 0 dashedName: step-104 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98cc.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98cc.md index eab541ac3f4..975130285e0 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98cc.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98cc.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e98cc -title: Step 4 +title: Schritt 4 challengeType: 0 dashedName: step-4 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d9.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d9.md index aa956d7889c..f7f731a86ce 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d9.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d9.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e98d9 -title: Step 17 +title: Schritt 17 challengeType: 0 dashedName: step-17 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98de.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98de.md index af393703a46..6189d57de48 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98de.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98de.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e98de -title: Step 22 +title: Schritt 22 challengeType: 0 dashedName: step-22 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e0.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e0.md index 8eacd57f64d..1de3a3b5867 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e0.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e0.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e98e0 -title: Step 24 +title: Schritt 24 challengeType: 0 dashedName: step-24 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f2.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f2.md index c0c21981a71..7e7efb1fe89 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f2.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f2.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e98f2 -title: Step 42 +title: Schritt 42 challengeType: 0 dashedName: step-42 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990a.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990a.md index 4a0b95c948e..b896afb1dd4 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990a.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990a.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e990a -title: Step 66 +title: Schritt 66 challengeType: 0 dashedName: step-66 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990d.md index 6a27d5d0cd6..b307b34b4a5 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990d.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e990d -title: Step 69 +title: Schritt 69 challengeType: 0 dashedName: step-69 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991c.md index 1d752c37238..b2c0f150e62 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991c.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e991c -title: Step 83 +title: Schritt 83 challengeType: 0 dashedName: step-83 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991f.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991f.md index 1f6852e16ec..615821e6ea7 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991f.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991f.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e991f -title: Step 86 +title: Schritt 86 challengeType: 0 dashedName: step-86 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9926.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9926.md index db44aeb4ae2..2eb1be39174 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9926.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9926.md @@ -11,19 +11,19 @@ Give the `.fb3-window` elements a `width` of `25%`, a `height` of `80%`, and use # --hints-- -You should give `.fb3-window` a `width` of `25%`. +Du solltest `.fb3-window` eine `width` von `25%` geben. ```js assert.equal(new __helpers.CSSHelp(document).getStyle(".fb3-window")?.width, "25%"); ``` -You should give `.fb3-window` a `height` of `80%`. +Du solltest `.fb3-window` eine `height` von `80%` geben. ```js assert.equal(new __helpers.CSSHelp(document).getStyle(".fb3-window")?.height, "80%"); ``` -You should give `.fb3-window` a `background-color` of `--window-color1`. +Du solltest `.fb3-window` einen `background-color` von `--window-color1` geben. ```js assert.equal(new __helpers.CSSHelp(document).getStyle(".fb3-window")?.backgroundColor.trim(), "var(--window-color1)"); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md index e6d0407488c..6a9a8742e0c 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md @@ -11,7 +11,7 @@ Add your `window-wrap` class to the `.fb3a` element to center and space the wind # --hints-- -You should give `.fb3a` a class of `window-wrap`. +Du solltest `.fb3a` eine Klasse von `window-wrap` geben. ```js assert.exists(document.querySelector("div.fb3a.window-wrap")); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992e.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992e.md index ab57df7fc09..24c61f9cde4 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992e.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992e.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e992e -title: Step 101 +title: Schritt 101 challengeType: 0 dashedName: step-101 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9930.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9930.md index 831ff2bcec4..004aa3cb406 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9930.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9930.md @@ -11,13 +11,13 @@ This building is going to have another triangle on top. Give the top section a ` # --hints-- -You should give `.fb4a` a `border-top` of `5vh solid transparent`. +Du solltest `.fb4a` ein `border-top` von `5vh solid transparent` geben. ```js assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4a")?.borderTop.trim(), "5vh solid transparent") ``` -You should give `.fb4a` a `border-left` of `8vw solid var(--building-color1)`. +Du solltest `.fb4a` ein `border-left` von `8vw solid var(--building-color1)` geben. ```js assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4a")?.borderLeft.trim(), "8vw solid var(--building-color1)") diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9931.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9931.md index fb74f17fbe4..37c44b9bc61 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9931.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9931.md @@ -7,11 +7,11 @@ dashedName: step-109 # --description-- -You can remove the `background-color` for this building now, since it isn't needed. +Du kannst den `background-color` für das Gebäude jetzt entfernen, da er nicht länger benötigt wird. # --hints-- -You should remove the `background-color` of `.fb6`. +Du solltest die `background-color` von `.fb6` entfernen. ```js assert.notMatch(code, /\.fb6\s*\{\s*[^}]*?background-color[^}]*?\}/); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9933.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9933.md index 60f7fe5ad21..40dcd04f334 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9933.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9933.md @@ -1,6 +1,6 @@ --- id: 5d822fd413a79914d39e9933 -title: Step 105 +title: Schritt 105 challengeType: 0 dashedName: step-105 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dc23f9bf86c76b9248c6eba.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dc23f9bf86c76b9248c6eba.md index 0271d839b31..76831d24750 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dc23f9bf86c76b9248c6eba.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dc23f9bf86c76b9248c6eba.md @@ -1,6 +1,6 @@ --- id: 5dc23f9bf86c76b9248c6eba -title: Step 7 +title: Schritt 7 challengeType: 0 dashedName: step-7 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa3589eacea3f48c6300ae.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa3589eacea3f48c6300ae.md index 303300a19dc..480db7d1973 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa3589eacea3f48c6300ae.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5dfa3589eacea3f48c6300ae.md @@ -1,6 +1,6 @@ --- id: 5dfa3589eacea3f48c6300ae -title: Step 18 +title: Schritt 18 challengeType: 0 dashedName: step-18 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804d6.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804d6.md index 561b47e1080..dee04434117 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804d6.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804d6.md @@ -1,6 +1,6 @@ --- id: 5ef9b03c81a63668521804d6 -title: Step 35 +title: Schritt 35 challengeType: 0 dashedName: step-35 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804db.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804db.md index 41c86f68f09..e5d76089e91 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804db.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804db.md @@ -1,6 +1,6 @@ --- id: 5ef9b03c81a63668521804db -title: Step 41 +title: Schritt 41 challengeType: 0 dashedName: step-41 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804e8.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804e8.md index 1f6967361a4..72fd9a91c54 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804e8.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804e8.md @@ -1,6 +1,6 @@ --- id: 5ef9b03c81a63668521804e8 -title: Step 63 +title: Schritt 63 challengeType: 0 dashedName: step-63 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5efb23e70dc218d6c85f89b1.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5efb23e70dc218d6c85f89b1.md index a35a54d38e9..5b21702236f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5efb23e70dc218d6c85f89b1.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5efb23e70dc218d6c85f89b1.md @@ -1,6 +1,6 @@ --- id: 5efb23e70dc218d6c85f89b1 -title: Step 38 +title: Schritt 38 challengeType: 0 dashedName: step-38 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5efc54138d6a74d05e68af76.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5efc54138d6a74d05e68af76.md index 1ae7036989f..906572bf888 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5efc54138d6a74d05e68af76.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5efc54138d6a74d05e68af76.md @@ -1,6 +1,6 @@ --- id: 5efc54138d6a74d05e68af76 -title: Step 55 +title: Schritt 55 challengeType: 0 dashedName: step-55 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f07c98cdb9413cbd4b16750.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f07c98cdb9413cbd4b16750.md index 9d0b1269dd3..9b033b46de2 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f07c98cdb9413cbd4b16750.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f07c98cdb9413cbd4b16750.md @@ -1,6 +1,6 @@ --- id: 5f07c98cdb9413cbd4b16750 -title: Step 17 +title: Schritt 17 challengeType: 0 dashedName: step-17 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f07fb1579dc934717801375.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f07fb1579dc934717801375.md index 22777df4431..7ff0be3cda3 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f07fb1579dc934717801375.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5f07fb1579dc934717801375.md @@ -1,6 +1,6 @@ --- id: 5f07fb1579dc934717801375 -title: Step 33 +title: Schritt 33 challengeType: 0 dashedName: step-33 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/62bb4009e3458a128ff57d5d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/62bb4009e3458a128ff57d5d.md index ade9d9a467d..49b5d7c56e0 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/62bb4009e3458a128ff57d5d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/62bb4009e3458a128ff57d5d.md @@ -1,6 +1,6 @@ --- id: 62bb4009e3458a128ff57d5d -title: Step 69 +title: Schritt 69 challengeType: 0 dashedName: step-69 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/62dabe2ef403a12d5d295273.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/62dabe2ef403a12d5d295273.md index 7780953b81e..c3d6ecea75e 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/62dabe2ef403a12d5d295273.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/62dabe2ef403a12d5d295273.md @@ -1,6 +1,6 @@ --- id: 62dabe2ef403a12d5d295273 -title: Step 13 +title: Schritt 13 challengeType: 0 dashedName: step-13 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60eebd07ea685b0e777b5583.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60eebd07ea685b0e777b5583.md index e8490875ffc..2596568c6b6 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60eebd07ea685b0e777b5583.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60eebd07ea685b0e777b5583.md @@ -1,6 +1,6 @@ --- id: 60eebd07ea685b0e777b5583 -title: Step 1 +title: Schritt 1 challengeType: 0 dashedName: step-1 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60f027c87bc98f050395c139.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60f027c87bc98f050395c139.md index 14dcec0e87c..fdab14794dd 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60f027c87bc98f050395c139.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60f027c87bc98f050395c139.md @@ -1,6 +1,6 @@ --- id: 60f027c87bc98f050395c139 -title: Step 3 +title: Schritt 3 challengeType: 0 dashedName: step-3 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60faca286cb48b07f6482970.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60faca286cb48b07f6482970.md index 0e7b60be1cd..3d5250f674f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60faca286cb48b07f6482970.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60faca286cb48b07f6482970.md @@ -7,37 +7,37 @@ dashedName: step-36 # --description-- -Submitting the form with an option selected would not send a useful value to the server. As such, each `option` needs to be given a `value` attribute. Without which, the text content of the `option` will be submitted to the server. +Durch das reine Abschicken eines Formulars mit ausgewähltem Optionsfeld würde dem Server kein sinnvoller Wert übermittelt. Jede `option` muss daher ein `value`-Attribut erhalten. Without which, the text content of the `option` will be submitted to the server. -Give the first `option` a `value` of `""`, and the subsequent `option` elements `value` attributes from `1` to `4`. +Weise der ersten `option` eine `value` von `""`, den nachfolgenden `option`-Elementen `value`-Attribute von `1` bis `4` zu. # --hints-- -You should give the first `option` a `value` of `""`. +Du solltest der ersten `option` eine `value` von `""` zuweisen. ```js assert.equal(document.querySelectorAll('fieldset:nth-child(3) > label:nth-child(3) option')?.[0]?.value, ''); ``` -You should give the second `option` a `value` of `1`. +Du solltest der zweiten `option` eine `value` von `1` zuweisen. ```js assert.equal(document.querySelectorAll('fieldset:nth-child(3) > label:nth-child(3) option')?.[1]?.value, '1'); ``` -You should give the third `option` a `value` of `2`. +Du solltest der dritten `option` eine `value` von `2` zuweisen. ```js assert.equal(document.querySelectorAll('fieldset:nth-child(3) > label:nth-child(3) option')?.[2]?.value, '2'); ``` -You should give the fourth `option` a `value` of `3`. +Du solltest der vierten `option` eine `value` von `3` zuweisen. ```js assert.equal(document.querySelectorAll('fieldset:nth-child(3) > label:nth-child(3) option')?.[3]?.value, '3'); ``` -You should give the fifth `option` a `value` of `4`. +Du solltest der fünften `option` eine `value` von `4` zuweisen. ```js assert.equal(document.querySelectorAll('fieldset:nth-child(3) > label:nth-child(3) option')?.[4]?.value, '4'); diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fad1cafcde010995e15306.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fad1cafcde010995e15306.md index ec598b5f119..257e7b155e2 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fad1cafcde010995e15306.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fad1cafcde010995e15306.md @@ -1,6 +1,6 @@ --- id: 60fad1cafcde010995e15306 -title: Step 41 +title: Schritt 41 challengeType: 0 dashedName: step-41 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fad99e09f9d30c1657e790.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fad99e09f9d30c1657e790.md index 23648274cab..bd9a39e6055 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fad99e09f9d30c1657e790.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fad99e09f9d30c1657e790.md @@ -1,6 +1,6 @@ --- id: 60fad99e09f9d30c1657e790 -title: Step 44 +title: Schritt 44 challengeType: 0 dashedName: step-44 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fadce90f85c50d0bb0dd4f.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fadce90f85c50d0bb0dd4f.md index fd4d4dfde16..66408ec2dfd 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fadce90f85c50d0bb0dd4f.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60fadce90f85c50d0bb0dd4f.md @@ -1,6 +1,6 @@ --- id: 60fadce90f85c50d0bb0dd4f -title: Step 46 +title: Schritt 46 challengeType: 0 dashedName: step-46 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/62cc5b1779e4d313466f73c5.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/62cc5b1779e4d313466f73c5.md index 3a5ca7d795c..a6b7077d224 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/62cc5b1779e4d313466f73c5.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/62cc5b1779e4d313466f73c5.md @@ -1,6 +1,6 @@ --- id: 62cc5b1779e4d313466f73c5 -title: Step 5 +title: Schritt 5 challengeType: 0 dashedName: step-5 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157a.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157a.md index 783059fe6ea..9728e562d01 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157a.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157a.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5157a -title: Step 4 +title: Schritt 4 challengeType: 0 dashedName: step-4 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157b.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157b.md index 991faf7c73c..bb80fb3b34d 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157b.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157b.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5157b -title: Step 5 +title: Schritt 5 challengeType: 0 dashedName: step-5 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157c.md index 2a5212af9f6..57df48ddb55 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157c.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5157c -title: Step 6 +title: Schritt 6 challengeType: 0 dashedName: step-6 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157f.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157f.md index fe1b3d271a0..20ed0fad7f6 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157f.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5157f.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5157f -title: Step 9 +title: Schritt 9 challengeType: 0 dashedName: step-9 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51581.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51581.md index c839e87edd4..e72889b6277 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51581.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51581.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51581 -title: Step 11 +title: Schritt 11 challengeType: 0 dashedName: step-11 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51582.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51582.md index 396e5874ef2..38fee0db761 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51582.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51582.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51582 -title: Step 12 +title: Schritt 12 challengeType: 0 dashedName: step-12 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51583.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51583.md index 3049a1dd86c..165f13209ad 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51583.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51583.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51583 -title: Step 13 +title: Schritt 13 challengeType: 0 dashedName: step-13 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51584.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51584.md index c346c018103..787e8dbfabc 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51584.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51584.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51584 -title: Step 14 +title: Schritt 14 challengeType: 0 dashedName: step-14 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51586.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51586.md index ee40a15330e..db373554127 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51586.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51586.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51586 -title: Step 16 +title: Schritt 16 challengeType: 0 dashedName: step-16 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51588.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51588.md index 458f84fd1ac..c2c542edd41 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51588.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51588.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51588 -title: Step 18 +title: Schritt 18 challengeType: 0 dashedName: step-18 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51589.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51589.md index 5e6f8e7092c..d2983d02cca 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51589.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51589.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51589 -title: Step 19 +title: Schritt 19 challengeType: 0 dashedName: step-19 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158a.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158a.md index eed022dadee..26ff60d21ac 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158a.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158a.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5158a -title: Step 20 +title: Schritt 20 challengeType: 0 dashedName: step-20 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158b.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158b.md index 21f9a6572a9..465869d8c0f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158b.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158b.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5158b -title: Step 21 +title: Schritt 21 challengeType: 0 dashedName: step-21 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158c.md index ab21b1616a6..d5c0f2f3d5f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158c.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5158c -title: Step 22 +title: Schritt 22 challengeType: 0 dashedName: step-22 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158e.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158e.md index 918cfcee918..5bc0dd7449f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158e.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5158e.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5158e -title: Step 24 +title: Schritt 24 challengeType: 0 dashedName: step-24 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51590.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51590.md index 7348596a0ac..a89ccd7f63f 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51590.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51590.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51590 -title: Step 26 +title: Schritt 26 challengeType: 0 dashedName: step-26 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51593.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51593.md index 5da3409e73c..96f6a4831ef 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51593.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51593.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51593 -title: Step 29 +title: Schritt 29 challengeType: 0 dashedName: step-29 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51594.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51594.md index 06e43acd7fc..e9710823b4a 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51594.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51594.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51594 -title: Step 30 +title: Schritt 30 challengeType: 0 dashedName: step-30 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51595.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51595.md index f0f74855c97..a2943bd216e 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51595.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51595.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51595 -title: Step 31 +title: Schritt 31 challengeType: 0 dashedName: step-31 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51596.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51596.md index f529c198260..1f33c565e35 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51596.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51596.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51596 -title: Step 32 +title: Schritt 32 challengeType: 0 dashedName: step-32 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51597.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51597.md index 4452135e0e8..3c0e75a9491 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51597.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51597.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51597 -title: Step 33 +title: Schritt 33 challengeType: 0 dashedName: step-33 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51598.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51598.md index 6862ba81e32..2081e806676 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51598.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51598.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51598 -title: Step 34 +title: Schritt 34 challengeType: 0 dashedName: step-34 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51599.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51599.md index 5345923d870..e1706a1f2d3 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51599.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c51599.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c51599 -title: Step 35 +title: Schritt 35 challengeType: 0 dashedName: step-35 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159a.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159a.md index 200303c44c3..68998e8afd5 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159a.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159a.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5159a -title: Step 36 +title: Schritt 36 challengeType: 0 dashedName: step-36 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159b.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159b.md index 028c4b8201b..2e93e378bd4 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159b.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159b.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5159b -title: Step 37 +title: Schritt 37 challengeType: 0 dashedName: step-37 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159d.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159d.md index b38bc5b0028..a27978de417 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159d.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159d.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5159d -title: Step 39 +title: Schritt 39 challengeType: 0 dashedName: step-39 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159e.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159e.md index c018cfb1ad8..0665b326286 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159e.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159e.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5159e -title: Step 40 +title: Schritt 40 challengeType: 0 dashedName: step-40 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159f.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159f.md index 3a072044119..08ab5dca535 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159f.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c5159f.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c5159f -title: Step 42 +title: Schritt 42 challengeType: 0 dashedName: step-42 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515a3.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515a3.md index 7ea17b04646..1c6c8a203f8 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515a3.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515a3.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515a3 -title: Step 46 +title: Schritt 46 challengeType: 0 dashedName: step-46 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515ab.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515ab.md index 7ec650f9505..43b884c132a 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515ab.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515ab.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515ab -title: Step 54 +title: Schritt 54 challengeType: 0 dashedName: step-54 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b7.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b7.md index 605930d069d..de105ac1c5b 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b7.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b7.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515b7 -title: Step 66 +title: Schritt 66 challengeType: 0 dashedName: step-66 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b9.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b9.md index 01d8ba35100..382675256f4 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b9.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b9.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515b9 -title: Step 68 +title: Schritt 68 challengeType: 0 dashedName: step-68 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515be.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515be.md index 96cea01cca3..4a6542bbbe7 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515be.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515be.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515be -title: Step 80 +title: Schritt 80 challengeType: 0 dashedName: step-80 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c0.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c0.md index 27df919c8eb..9f9790da5ef 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c0.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c0.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515c0 -title: Step 82 +title: Schritt 82 challengeType: 0 dashedName: step-82 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c2.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c2.md index 8494e705fdf..8f2a5e7ae4b 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c2.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c2.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515c2 -title: Step 84 +title: Schritt 84 challengeType: 0 dashedName: step-84 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c3.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c3.md index 5fbd79f0233..008272d626a 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c3.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c3.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515c3 -title: Step 85 +title: Schritt 85 challengeType: 0 dashedName: step-85 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c4.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c4.md index 00ca401236c..2bdcdc1642c 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c4.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c4.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515c4 -title: Step 86 +title: Schritt 86 challengeType: 0 dashedName: step-86 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c5.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c5.md index ece6f1c39be..56cba6766cb 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c5.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515c5.md @@ -1,6 +1,6 @@ --- id: 60b69a66b6ddb80858c515c5 -title: Step 87 +title: Schritt 87 challengeType: 0 dashedName: step-87 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd67a656743144844941cb.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd67a656743144844941cb.md index 0be766dccc7..cf492858772 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd67a656743144844941cb.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd67a656743144844941cb.md @@ -1,6 +1,6 @@ --- id: 61fd67a656743144844941cb -title: Step 4 +title: Schritt 4 challengeType: 0 dashedName: step-4 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd6ab779390f49148773bb.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd6ab779390f49148773bb.md index 2d5052298f7..2dc726497bd 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd6ab779390f49148773bb.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd6ab779390f49148773bb.md @@ -1,6 +1,6 @@ --- id: 61fd6ab779390f49148773bb -title: Step 5 +title: Schritt 5 challengeType: 0 dashedName: step-5 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd70336ebb3e4f62ee81ba.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd70336ebb3e4f62ee81ba.md index 630d13d656d..800d6e2a1e5 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd70336ebb3e4f62ee81ba.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd70336ebb3e4f62ee81ba.md @@ -1,6 +1,6 @@ --- id: 61fd70336ebb3e4f62ee81ba -title: Step 8 +title: Schritt 8 challengeType: 0 dashedName: step-8 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd7a160ed17960e971f28b.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd7a160ed17960e971f28b.md index 85c417f4780..906dfd8ddd0 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd7a160ed17960e971f28b.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd7a160ed17960e971f28b.md @@ -1,6 +1,6 @@ --- id: 61fd7a160ed17960e971f28b -title: Step 16 +title: Schritt 16 challengeType: 0 dashedName: step-16 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd9126aa72a474301fc49f.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd9126aa72a474301fc49f.md index abec451e896..ab79e241e4a 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd9126aa72a474301fc49f.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/61fd9126aa72a474301fc49f.md @@ -1,6 +1,6 @@ --- id: 61fd9126aa72a474301fc49f -title: Step 20 +title: Schritt 20 challengeType: 0 dashedName: step-20 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/620159cd5431aa34bc6a4c9c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/620159cd5431aa34bc6a4c9c.md index b076cdd1f61..c3181180f9a 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/620159cd5431aa34bc6a4c9c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/620159cd5431aa34bc6a4c9c.md @@ -1,6 +1,6 @@ --- id: 620159cd5431aa34bc6a4c9c -title: Step 36 +title: Schritt 36 challengeType: 0 dashedName: step-36 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017fa5bbef406580ceb44f.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017fa5bbef406580ceb44f.md index b5b1ae3a4a6..92c0970bde8 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017fa5bbef406580ceb44f.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62017fa5bbef406580ceb44f.md @@ -1,6 +1,6 @@ --- id: 62017fa5bbef406580ceb44f -title: Step 47 +title: Schritt 47 challengeType: 0 dashedName: step-47 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/6201a42e39bf3b95b6a33bf3.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/6201a42e39bf3b95b6a33bf3.md index 2980b62b73f..35e420162d4 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/6201a42e39bf3b95b6a33bf3.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/6201a42e39bf3b95b6a33bf3.md @@ -1,6 +1,6 @@ --- id: 6201a42e39bf3b95b6a33bf3 -title: Step 62 +title: Schritt 62 challengeType: 0 dashedName: step-62 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612e78af05201622d4bab8aa.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612e78af05201622d4bab8aa.md index 91da47bb762..bda86f60519 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612e78af05201622d4bab8aa.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612e78af05201622d4bab8aa.md @@ -1,6 +1,6 @@ --- id: 612e78af05201622d4bab8aa -title: Step 3 +title: Schritt 3 challengeType: 0 dashedName: step-3 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612ead8788d28655ef8db056.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612ead8788d28655ef8db056.md index 67a6701792f..bee2a224499 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612ead8788d28655ef8db056.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612ead8788d28655ef8db056.md @@ -1,6 +1,6 @@ --- id: 612ead8788d28655ef8db056 -title: Step 20 +title: Schritt 20 challengeType: 0 dashedName: step-20 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612eb7ca8c275d5f89c73333.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612eb7ca8c275d5f89c73333.md index 5d2f93e336c..8ebcec0e142 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612eb7ca8c275d5f89c73333.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612eb7ca8c275d5f89c73333.md @@ -1,6 +1,6 @@ --- id: 612eb7ca8c275d5f89c73333 -title: Step 24 +title: Schritt 24 challengeType: 0 dashedName: step-24 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612ec19d5268da7074941f84.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612ec19d5268da7074941f84.md index 8c2374e0a55..a19faa07dec 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612ec19d5268da7074941f84.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612ec19d5268da7074941f84.md @@ -1,6 +1,6 @@ --- id: 612ec19d5268da7074941f84 -title: Step 32 +title: Schritt 32 challengeType: 0 dashedName: step-32 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69972.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69972.md index 65f77ecc018..f2b666b6225 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69972.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69972.md @@ -1,6 +1,6 @@ --- id: 60a3e3396c7b40068ad69972 -title: Step 9 +title: Schritt 9 challengeType: 0 dashedName: step-9 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69984.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69984.md index 2def25b262f..279a045f06c 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69984.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69984.md @@ -1,6 +1,6 @@ --- id: 60a3e3396c7b40068ad69984 -title: Step 27 +title: Schritt 27 challengeType: 0 dashedName: step-27 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad6998c.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad6998c.md index fac990dcb91..f0ca05b7bc9 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad6998c.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad6998c.md @@ -1,6 +1,6 @@ --- id: 60a3e3396c7b40068ad6998c -title: Step 34 +title: Schritt 34 challengeType: 0 dashedName: step-34 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69996.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69996.md index ed50b6b0893..4b08014b71d 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69996.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad69996.md @@ -1,6 +1,6 @@ --- id: 60a3e3396c7b40068ad69996 -title: Step 44 +title: Schritt 44 challengeType: 0 dashedName: step-44 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f2abbe7d18d49a1e0e1c8.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f2abbe7d18d49a1e0e1c8.md index 750166024ce..00f42cede4a 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f2abbe7d18d49a1e0e1c8.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f2abbe7d18d49a1e0e1c8.md @@ -1,6 +1,6 @@ --- id: 615f2abbe7d18d49a1e0e1c8 -title: Step 1 +title: Schritt 1 challengeType: 0 dashedName: step-1 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f3ed16592445e57941aec.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f3ed16592445e57941aec.md index 53f6d70c156..5cec20b8c74 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f3ed16592445e57941aec.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f3ed16592445e57941aec.md @@ -1,6 +1,6 @@ --- id: 615f3ed16592445e57941aec -title: Step 16 +title: Schritt 16 challengeType: 0 dashedName: step-16 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f522dea4f776f64dc3e91.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f522dea4f776f64dc3e91.md index 9fb0777d991..44e49267cd2 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f522dea4f776f64dc3e91.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f522dea4f776f64dc3e91.md @@ -1,6 +1,6 @@ --- id: 615f522dea4f776f64dc3e91 -title: Step 31 +title: Schritt 31 challengeType: 0 dashedName: step-31 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f5af373a68e744a3c5a76.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f5af373a68e744a3c5a76.md index b833b5f471e..89dba8c028c 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f5af373a68e744a3c5a76.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/615f5af373a68e744a3c5a76.md @@ -1,6 +1,6 @@ --- id: 615f5af373a68e744a3c5a76 -title: Step 36 +title: Schritt 36 challengeType: 0 dashedName: step-36 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/635bde33c91c80540eae239b.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/635bde33c91c80540eae239b.md index d9073bf18ba..cf8fd8e8d43 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/635bde33c91c80540eae239b.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/635bde33c91c80540eae239b.md @@ -1,6 +1,6 @@ --- id: 635bde33c91c80540eae239b -title: Step 41 +title: Schritt 41 challengeType: 0 dashedName: step-41 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/6395d33ab5d91bf317107c48.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/6395d33ab5d91bf317107c48.md index e6f009b7e04..854dcd7d2bf 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/6395d33ab5d91bf317107c48.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/6395d33ab5d91bf317107c48.md @@ -1,6 +1,6 @@ --- id: 6395d33ab5d91bf317107c48 -title: Step 32 +title: Schritt 32 challengeType: 0 dashedName: step-32 --- diff --git a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/6396e33fe478dd264ebbf278.md b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/6396e33fe478dd264ebbf278.md index 6a2dbb37aa9..1343b674148 100644 --- a/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/6396e33fe478dd264ebbf278.md +++ b/curriculum/challenges/german/14-responsive-web-design-22/learn-typography-by-building-a-nutrition-label/6396e33fe478dd264ebbf278.md @@ -1,6 +1,6 @@ --- id: 6396e33fe478dd264ebbf278 -title: Step 34 +title: Schritt 34 challengeType: 0 dashedName: step-34 --- diff --git a/curriculum/challenges/italian/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md b/curriculum/challenges/italian/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md index eac95d56d18..64426e57c25 100644 --- a/curriculum/challenges/italian/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md +++ b/curriculum/challenges/italian/05-back-end-development-and-apis/basic-node-and-express/serve-an-html-file.md @@ -11,7 +11,7 @@ dashedName: serve-an-html-file È possibile rispondere alle richieste con un file utilizzando il metodo `res.sendFile(path)`. Puoi inserirlo all'interno del gestore della rotta `app.get('/', ...)`. Dietro le quinte, questo metodo imposterà le intestazioni appropriate per istruire il browser su come gestire il file che si desidera inviare, in base al suo tipo. Quindi leggerà e invierà il file. Questo metodo necessita di un percorso di file assoluto. Ti consigliamo di utilizzare la variabile globale Node `__dirname` per calcolare il percorso in questo modo: ```js -absolutePath = __dirname + relativePath/file.ext +absolutePath = __dirname + '/relativePath/file.ext' ``` # --instructions-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-build-a-recipe-project/top-build-a-recipe-project.md b/curriculum/challenges/italian/16-the-odin-project/top-build-a-recipe-project/top-build-a-recipe-project.md index 39441cd555d..4477438009e 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-build-a-recipe-project/top-build-a-recipe-project.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-build-a-recipe-project/top-build-a-recipe-project.md @@ -1,40 +1,40 @@ --- id: 6391d1a4f7ac71efd0621380 -title: Build a Recipe Page Project +title: Crea il progetto della pagina di una ricetta challengeType: 14 dashedName: top-build-a-recipe-project --- # --description-- -The website will consist of a main index page which will have links to a few recipes. The website won’t look very pretty by the time you’ve finished. +Il sito web sarà composto da una pagina index principale che avrà dei link ad alcune ricette. Il sito web non sembrerà molto carino nel momento in cui avrai finito. -**User Stories:** +**User story:** -1. Your recipe page should contain a `DOCTYPE` tag. -1. Your recipe page should include an `html` element with a `head` and `body` element as children. -1. You should have a `title` element within the `head` element with the text `The Odin Recipes`. -1. You should see an `h1` element that has the text `Creamy Chocolate Fudge`. -1. You should see an image with the url `*placeholder-fcc-cdn*` with a fitting `alt` text. -1. There should be an `h2` element with the text `Description` under the image. -1. You should see a couple of paragraphs under `Description` that describe the recipe. -1. There should be an `h2` element with the text `Ingredients` -1. Under the `Ingredients` heading there should be an unordered list with the ingredients needed for the recipe. -1. Under the list of ingredients add another heading called `Steps`. -1. You should see an ordered list with a couple of steps needed to complete the recipe. -1. Under the steps there should be an `h2` element with the text `More Recipes` -1. You should see a couple of links to other recipes inside an unordered list which has a couple of list items with anchor elements within. -1. These anchor elements should have `href` attribute with the value set to `#` +1. La pagina di ricette dovrebbe contenere un tag `DOCTYPE`. +1. La pagina di ricette dovrebbe includere un elemento `html` con degli elementi `head` e `body` come figli. +1. Dovresti avere un elemento `title` all'interno dell'elemento `head` con il testo `The Odin Recipes`. +1. Dovresti vedere un elemento `h1` con il testo `Creamy Chocolate Fudge`. +1. Dovresti vedere un'immagine con l'url `*placeholder-fcc-cdn*` con un testo `alt` adatto. +1. Dovrebbe esserci un elemento `h2` con il testo `Description` sotto l'immagine. +1. Dovresti vedere un paio di paragrafi che descrivono la ricetta sotto `Description`. +1. Dovrebbe esserci un elemento `h2` con il testo `Ingredients` +1. Sotto l'intestazione `Ingredients` dovrebbe esserci una lista non ordinata con gli ingredienti necessari per la ricetta. +1. Sotto l'elenco degli ingredienti aggiungi un'altra intestazione chiamata `Steps`. +1. Dovresti vedere una lista ordinata con un paio di passaggi necessari per completare la ricetta. +1. Sotto gli step dovrebbe esserci un elemento `h2` con il testo `More Recipes` +1. Dovresti vedere un paio di link ad altre ricette all'interno di una lista non ordinata che ha un paio di elementi di lista con elementi di ancoraggio al suo interno. +1. Questi elementi di ancoraggio dovrebbero avere un attributo `href` con il valore `#` # --hints-- -You should have a `DOCTYPE` tag. +Dovresti avere un tag `DOCTYPE`. ```js assert(code.match(/<!DOCTYPE\s+?html\s*?>/gi)); ``` -You should have a `html` element with `head` and `body` element. +Dovresti avere un elemento `html` con un elemento `head` e un elemento `body`. ```js const html = document.querySelectorAll('html')[0]; @@ -44,19 +44,19 @@ const body = document.querySelectorAll('html > body')[0]; assert(html && head && body); ``` -You should have a `title` element within the `head` element that contains the text `The Odin Recipes`. +Dovresti avere un elemento `title` all'interno dell'elemento `head` che contiene il testo `The Odin Recipes`. ```js assert(document.querySelectorAll('HEAD > TITLE')[0].innerText == 'The Odin Recipes'); ``` -You should have a `h1` element within your `body` element that contains the text `Creamy Chocolate Fudge`. +Dovresti avere un elemento `h1` all'interno dell'elemento `body` che contiene il testo `Creamy Chocolate Fudge`. ```js assert(document.querySelectorAll('BODY > H1')[0].innerText == 'Creamy Chocolate Fudge'); ``` -You should have an image with the url `*placeholder-fcc-cdn*` with an `alt` attribute that has a fitting text. +Dovresti avere un'immagine con l'url `*placeholder-fcc-cdn*` con un attributo `alt` con un testo adatto. ```js const img = document.querySelectorAll('IMG')[0]; @@ -64,7 +64,7 @@ const img = document.querySelectorAll('IMG')[0]; assert(img && img.alt !='' && img.src === 'https://i.imgur.com/p0J5baJ.jpg') ``` -You should have an `h2` element with the text `Description`. +Dovresti avere un elemento `h2` con il testo `Description`. ```js const h2 = document.querySelectorAll('H2')[0]; @@ -72,7 +72,7 @@ const h2 = document.querySelectorAll('H2')[0]; assert(h2.innerText == 'Description'); ``` -You should have at least two `p` elements describing the recipe. +Dovresti avere almeno due elementi `p` che descrivono la ricetta. ```js const paragraphs = document.querySelectorAll('P'); @@ -80,7 +80,7 @@ const paragraphs = document.querySelectorAll('P'); assert(paragraphs.length > 1); ``` -You should have an `h2` element with the text `Ingredients`. +Dovresti avere un elemento `h2` con il testo `Ingredients`. ```js const h2 = document.querySelectorAll('H2')[1]; @@ -88,7 +88,7 @@ const h2 = document.querySelectorAll('H2')[1]; assert(h2.innerText == 'Ingredients'); ``` -You should have an unordered list `<ul>` with some ingredients as the list items `<li>`. +Dovresti avere una lista non ordinata `<ul>` con alcuni ingredienti come elementi della lista `<li>`. ```js const unorderedList = document.querySelectorAll('UL')[0]; @@ -97,7 +97,7 @@ const listItems = document.querySelectorAll('UL > LI'); assert(unorderedList && listItems && listItems.length > 1); ``` -You should have an `h2` element with the text `Steps`. +Dovresti avere un elemento `h2` con il testo `Steps`. ```js const h2 = document.querySelectorAll('H2')[2]; @@ -105,7 +105,7 @@ const h2 = document.querySelectorAll('H2')[2]; assert(h2.innerText == 'Steps'); ``` -You should have a `<ol>` with the the steps as the list items `<li>`. +Dovresti avere un `<ol>` con i passaggi come elementi della lista `<li>`. ```js const orderedList = document.querySelectorAll('OL')[0]; @@ -114,7 +114,7 @@ const listItems = document.querySelectorAll('OL > LI'); assert(orderedList && listItems && listItems.length > 1); ``` -You should have an `h2` element with the text `More Recipes`. +Dovresti avere un elemento `h2` con il testo `More Recipes`. ```js const h2 = document.querySelectorAll('H2')[3]; @@ -122,7 +122,7 @@ const h2 = document.querySelectorAll('H2')[3]; assert(h2.innerText == 'More Recipes'); ``` -You should have an unordered list `<ul>` element with list items `<li>` that contain `<a>` tags which lead to other recipes. +Dovresti avere un elemento lista non ordinata `<ul>` con gli elementi di lista `<li>` che contengono dei tag `<a>` che rimandano ad altre ricette. ```js const unorderedList = document.querySelectorAll('UL')[1]; @@ -137,7 +137,7 @@ const containsAnchors = [...listItems].every(function(listItem) { assert(unorderedList && allAreListItems && containsAnchors && listItems.length > 1); ``` -Your anchor tags linking to the recipes should have a `href` attribute with the value set to `#` +I tag di ancoraggio che linkano ad altre ricette dovrebbero avere un attributo `href` con il valore `#` ```js const anchorTags = document.querySelectorAll("a"); diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/elements-and-tags-question-a.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/elements-and-tags-question-a.md index f4b05b12871..73105b2fac3 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/elements-and-tags-question-a.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/elements-and-tags-question-a.md @@ -1,30 +1,30 @@ --- id: 637f4e0e72c65bc8e73dfe1e videoId: LGQuIIv2RVA -title: Elements and Tags Question A +title: Elementi e Tag Domanda A challengeType: 15 dashedName: elements-and-tags-question-a --- # --description-- -Almost all elements on an HTML page are just pieces of content wrapped in opening and closing HTML tags. +Quasi tutti gli elementi di una pagina HTML sono solo porzioni di contenuto racchiuse tra tag HTML di apertura e chiusura. -Opening tags tell the browser this is the start of an HTML element. They are comprised of a keyword enclosed in angle brackets `<>`. For example, an opening paragraph tag looks like this: `<p>`. +I tag di apertura comunicano al browser l'inizio di un elemento HTML. Sono costituiti da una parola chiave racchiusa tra parentesi angolate `<>`. Ad esempio, il tag di apertura di un paragrafo ha questo aspetto: `<p>`. -Closing tags tell the browser where an element ends. They are almost the same as opening tags; the only difference is that they have a forward slash before the keyword. For example, a closing paragraph tag looks like this: `</p>`. +I tag di chiusura comunicano al browser dove finisce un elemento. Sono molto simili ai tag di apertura; l'unica differenza è che hanno una barra obliqua prima della parola chiave. Ad esempio, il tag di chiusura di un paragrafo ha questo aspetto: `</p>`. -A full paragraph element looks like this: +Un elemento paragrafo completo ha questo aspetto: -<img src="https://cdn.statically.io/gh/TheOdinProject/curriculum/90b1a362af0bb8635af9593cd8911c9aefb68569/foundations/html_css/html-foundations/imgs/00.png" alt="element diagram" /> +<img src="https://cdn.statically.io/gh/TheOdinProject/curriculum/90b1a362af0bb8635af9593cd8911c9aefb68569/foundations/html_css/html-foundations/imgs/00.png" alt="diagramma di un elemento" /> -You can think of elements as containers for content. The opening and closing tags tell the browser what content the element contains. The browser can then use that information to determine how it should interpret and format the content. +Puoi pensare agli elementi come a contenitori per del contenuto. I tag di apertura e chiusura dicono al browser quale contenuto è racchiuso nell'elemento. Il browser può quindi utilizzare tali informazioni per determinare come interpretare e formattare il contenuto. -There are some HTML elements that do not have a closing tag. These elements often look like this: `<br />` or `<img/>`, but some can also be used without the closing forward slash such as `<br>` or `<img>`. These are known as self-closing tags or empty elements because they don’t wrap any content. You will encounter a few of these in later lessons, but for the most part, elements will have both opening and closing tags. +Esistono alcuni elementi HTML che non hanno un tag di chiusura. Questi elementi spesso hanno questo aspetto: `<br />` o `<img/>`, ma alcuni possono essere anche usati senza la barra obliqua di chiusura, come `<br>` o `<img>`. Sono detti tag a chiusura automatica o elementi vuoti poiché non racchiudono alcun contenuto. Ne incontrerai alcuni nelle lezioni successive, ma per la maggior parte, gli elementi hanno sia il tag di apertura che di chiusura. -HTML has a vast list of predefined tags that you can use to create all kinds of different elements. It is important to use the correct tags for content. Using the correct tags can have a big impact on two aspects of your sites: how they are ranked in search engines; and how accessible they are to users who rely on assistive technologies, like screen readers, to use the internet. +L'HTML possiede un'ampia lista di tag predefiniti che puoi usare per creare tutti i diversi tipi di elementi. È importante usare i tag corretti per i contenuti. Usare i tag corretti può avere un grosso impatto su due aspetti dei tuoi siti: come vengono valutati dai motori di ricerca e quanto sono accessibili agli utenti che per usare internet fanno affidamento a tecnologie assistive, come i lettori di schermo. -Using the correct elements for content is called semantic HTML. You will explore this in much more depth later on in the curriculum. +L'utilizzo degli elementi corretti per il contenuto è chiamato HTML semantico. In seguito esplorerai questo aspetto in modo molto più approfondito. # --question-- @@ -34,19 +34,19 @@ Watch Kevin Powell’s [Introduction to HTML video](https://www.youtube.com/watc ## --text-- -What are HTML tags? +Cosa sono i tag HTML? ## --answers-- -HTML tags tell the browser what content an element contains. +I tag HTML dicono al browser quale contenuto è racchiuso in un elemento. --- -HTML tags tell the browser when to load its content. +I tag HTML dicono al browser quando caricare il contenuto. --- -HTML tags tell the browser what content the next element contains. +I tag HTML dicono al browser quale contenuto è racchiuso nell'elemento successivo. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/elements-and-tags-question-b.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/elements-and-tags-question-b.md index 51bf43a7014..88613e0fbaf 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/elements-and-tags-question-b.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/elements-and-tags-question-b.md @@ -1,47 +1,47 @@ --- id: 637f4e1672c65bc8e73dfe1f -title: Elements and Tags Question B +title: Elementi e Tag Domanda B challengeType: 15 dashedName: elements-and-tags-question-b --- # --description-- -Almost all elements on an HTML page are just pieces of content wrapped in opening and closing HTML tags. +Quasi tutti gli elementi di una pagina HTML sono solo porzioni di contenuto racchiuse tra tag HTML di apertura e chiusura. -Opening tags tell the browser this is the start of an HTML element. They are comprised of a keyword enclosed in angle brackets <>. For example, an opening paragraph tag looks like this: `<p>`. +I tag di apertura comunicano al browser l'inizio di un elemento HTML. Sono costituiti da una parola chiave racchiusa tra parentesi angolate <>. Ad esempio, il tag di apertura di un paragrafo ha questo aspetto: `<p>`. -Closing tags tell the browser where an element ends. They are almost the same as opening tags; the only difference is that they have a forward slash before the keyword. For example, a closing paragraph tag looks like this: `</p>`. +I tag di chiusura comunicano al browser dove finisce un elemento. Sono molto simili ai tag di apertura; l'unica differenza è che hanno una barra obliqua prima della parola chiave. Ad esempio, il tag di chiusura di un paragrafo ha questo aspetto: `</p>`. -A full paragraph element looks like this: +Un elemento paragrafo completo ha questo aspetto: -<img src="https://cdn.statically.io/gh/TheOdinProject/curriculum/90b1a362af0bb8635af9593cd8911c9aefb68569/foundations/html_css/html-foundations/imgs/00.png" alt="element diagram" /> +<img src="https://cdn.statically.io/gh/TheOdinProject/curriculum/90b1a362af0bb8635af9593cd8911c9aefb68569/foundations/html_css/html-foundations/imgs/00.png" alt="diagramma di un elemento" /> -You can think of elements as containers for content. The opening and closing tags tell the browser what content the element contains. The browser can then use that information to determine how it should interpret and format the content. +Puoi pensare agli elementi come a contenitori per del contenuto. I tag di apertura e chiusura dicono al browser quale contenuto è racchiuso nell'elemento. Il browser può quindi utilizzare tali informazioni per determinare come interpretare e formattare il contenuto. -There are some HTML elements that do not have a closing tag. These elements often look like this: `<br />` or `<img/>`, but some can also be used without the closing forward slash such as `<br>` or `<img>`. These are known as self-closing tags or empty elements because they don’t wrap any content. You will encounter a few of these in later lessons, but for the most part, elements will have both opening and closing tags. +Esistono alcuni elementi HTML che non hanno un tag di chiusura. Questi elementi spesso hanno questo aspetto: `<br />` o `<img/>`, ma alcuni possono essere anche usati senza la barra obliqua di chiusura, come `<br>` o `<img>`. Sono detti tag a chiusura automatica o elementi vuoti poiché non racchiudono alcun contenuto. Ne incontrerai alcuni nelle lezioni successive, ma per la maggior parte, gli elementi hanno sia il tag di apertura che di chiusura. -HTML has a vast list of predefined tags that you can use to create all kinds of different elements. It is important to use the correct tags for content. Using the correct tags can have a big impact on two aspects of your sites: how they are ranked in search engines; and how accessible they are to users who rely on assistive technologies, like screen readers, to use the internet. +L'HTML possiede un'ampia lista di tag predefiniti che puoi usare per creare tutti i diversi tipi di elementi. È importante usare i tag corretti per i contenuti. Usare i tag corretti può avere un grosso impatto su due aspetti dei tuoi siti: come vengono valutati dai motori di ricerca e quanto sono accessibili agli utenti che per usare internet fanno affidamento a tecnologie assistive, come i lettori di schermo. -Using the correct elements for content is called semantic HTML. You will explore this in much more depth later on in the curriculum. +L'utilizzo degli elementi corretti per il contenuto è chiamato HTML semantico. In seguito esplorerai questo aspetto in modo molto più approfondito. # --question-- ## --text-- -What are the three parts of most HTML elements? +Quali sono i tre componenti della maggior parte degli elementi HTML? ## --answers-- -An opening tag, self closing tag, and content. +Tag di apertura, tag a chiusura automatica e contenuto. --- -An opening tag, closing tag, and content. +Tag di apertura, tag di chiusura e contenuto. --- -An opening tag, closing tag, and attribute. +Tag di apertura, tag di chiusura e attributo. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-a.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-a.md index ab85844e81b..8ee06c82fea 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-a.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-a.md @@ -1,52 +1,52 @@ --- id: 637f4e1c72c65bc8e73dfe20 -title: HTML Boilerplate Question A +title: Boilerplate HTML Domanda A challengeType: 15 dashedName: html-boilerplate-question-a --- # --description-- -To demonstrate an HTML boilerplate, you first need an HTML file to work with. +Per spiegare un boilerplate HTML, prima di tutto hai bisogno di un file HTML su cui lavorare. -Create a new folder on your computer and name it `html-boilerplate`. Within that folder create a new file and name it `index.html`. +Crea una nuova cartella sul tuo computer e chiamala `html-boilerplate`. All'interno di questa cartella crea un nuovo file e chiamalo `index.html`. -You’re probably already familiar with a lot of different types of files, for example doc, pdf, and image files. +Probabilmente hai già familiarità con molti tipi diversi di file, ad esempio file doc, pdf e immagini. -To let the computer know you want to create an HTML file, you need to append the filename with the `.html` extension as you have done when creating the `index.html` file. +Per far sapere al computer che vuoi creare un file HTML devi aggiungere dopo il nome del file l'estensione `.html` come hai fatto quando hai creato il file `index.html`. -It is worth noting that you named your HTML file index. You should always name the HTML file that will contain the homepage of your websites `index.html`. This is because web servers will by default look for an index.html page when users land on your websites - and not having one will cause big problems. +Vale la pena notare che hai chiamato il tuo file HTML index. Dovresti sempre chiamare il file HTML che conterrà la homepage dei tuoi siti web `index.html`. Questo perché quando gli utenti arriveranno su un sito i server web cercheranno, per impostazione predefinita, una pagina index.html - e non averne una causerà grandi problemi. -## The DOCTYPE +## DOCTYPE -Every HTML page starts with a doctype declaration. The doctype’s purpose is to tell the browser what version of HTML it should use to render the document. The latest version of HTML is HTML5, and the doctype for that version is simply `<!DOCTYPE html>`. +Ogni pagina HTML inizia con una dichiarazione doctype. Lo scopo della dichiarazione doctype è dire al browser quale versione di HTML dovrebbe usare per renderizzare il documento. L'ultima versione di HTML è HTML5 e il doctype per questa versione è semplicemente `<!DOCTYPE html>`. -The doctypes for older versions of HTML were a bit more complicated. For example, this is the doctype declaration for HTML4: +I doctype per le versioni di HTML precedenti erano un po 'più complicati. Ad esempio, questa è la dichiarazione doctype per HTML4: ```html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> ``` -However, you probably won’t ever want to be using an older version of HTML, and so you’ll always use `<!DOCTYPE html>`. +Tuttavia, probabilmente non ti troverai mai a usare delle vecchie versioni di HTML, quindi utilizza sempre `<!DOCTYPE html>`. -Open the `index.html` file created earlier in your text editor and add `<!DOCTYPE html>` to the very first line. +Apri nel tuo editor di testo il file `index.html` creato precedentemente e aggiungi `<!DOCTYPE html>` nella prima riga. # --question-- ## --text-- -What is the purpose of the `DOCTYPE` declaration? +Qual è lo scopo della dichiarazione `DOCTYPE`? ## --answers-- -It tells the browser which version of HTML to use to render the document. +Indica al browser quale versione di HTML usare per renderizzare il documento. --- -It tells the browser that this document uses JavaScript. +Indica al browser che il documento utilizza JavaScript. --- -It tells the browser the title of the document. +Indica al browser il titolo del documento. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-b.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-b.md index ffd10a4b5ac..f706065b9f7 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-b.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-b.md @@ -1,17 +1,17 @@ --- id: 637f4e2872c65bc8e73dfe21 -title: HTML Boilerplate Question B +title: Boilerplate HTML Domanda B challengeType: 15 dashedName: html-boilerplate-question-b --- # --description-- -After you declare the doctype, you need to provide an `<html>` element. This is what’s known as the root element of the document, meaning that every other element in the document will be a descendant of it. +Dopo aver dichiarato il doctype, devi costituire l'elemento `<html>`. Si tratta di quello che è conosciuto come elemento radice (root) del documento, da cui discende ogni altro elemento. -This becomes more important later on when you learn about manipulating HTML with JavaScript. For now, just know that the `html` element should be included on every HTML document. +Ciò diventerà più importante in seguito quando imparerai a manipolare HTML con JavaScript. Per ora sappi che l'elemento `html` dovrebbe essere incluso in ogni documento HTML. -Back in the `index.html` file, let’s add the `<html>` element by typing out its opening and closing tags, like so: +Tornando al file `index.html`, aggiungi l'elemento `<html>` digitando i suoi tag di apertura e chiusura, in questo modo: ```html <!DOCTYPE html> @@ -19,26 +19,26 @@ Back in the `index.html` file, let’s add the `<html>` element by typing out it </html> ``` -## What is the lang attribute? -`lang` specifies the language of the text content in that element. This attribute is primarily used for improving accessibility of the webpage. It allows assistive technologies, for example screen readers, to adapt according to the language and invoke correct pronunciation. +## Cos'è l'attributo lang? +`lang` specifica la lingua del contenuto di testo dell'elemento. Questo attributo è utilizzato principalmente per migliorare l'accessibilità della pagina web. Permette alle tecnologie assistive, come i lettori di schermo, di adattarsi in base alla lingua e di utilizzare la pronuncia corretta. # --question-- ## --text-- -What is the `html` element? +Cos'è l'elemento `html`? ## --answers-- -It is the root element in the document and tells the browser which version of HTML it should use. +È l'elemento radice del documento e dice al browser quale versione di HTML dovrebbe usare. --- -It is the root element in the document and all other elements should descend from it. +È l'elemento radice del documento e tutti gli altri elementi dovrebbero discendere da esso. --- -It is the root element in the document and all other elements should come after it. +È l'elemento radice del documento e tutti gli altri elementi dovrebbero essere posizionati dopo di esso. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-c.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-c.md index 8ce35fdeec2..cf65aace2d4 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-c.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-c.md @@ -1,33 +1,33 @@ --- id: 637f4e2f72c65bc8e73dfe22 -title: HTML Boilerplate Question C +title: Boilerplate HTML Domanda C challengeType: 15 dashedName: html-boilerplate-question-c --- # --description-- -The `<head>` element is where you put important meta-information about your webpages, and stuff required for your webpages to render correctly in the browser. Inside the `<head>`, you should not use any element that displays content on the webpage. +L'elemento `<head>` contiene importanti metadati sulle pagine web e le cose necessarie per renderizzarle correttamente nel browser. All'interno dell'`<head>`, non dovresti usare nessun elemento che mostri del contenuto nella pagina web. -## The Charset Meta Element -You should always have the `meta` tag for the charset encoding of the webpage in the head element: `<meta charset="utf-8">`. +## L'elemento meta charset +Il tag `meta` per la codifica dei caratteri della pagina web dovrebbe sempre essere nell'elemento head: `<meta charset="utf-8">`. -Setting the encoding is very important because it ensures that the webpage will display special symbols and characters from different languages correctly in the browser. +Impostare la codifica è molto importante perché assicura che la pagina web mostri correttamente nel browser simboli speciali e caratteri provenienti da lingue diverse. -## Title Element -Another element you should always include in the head of an HTML document is the `title` element: +## L'elemento title +Un altro elemento che dovresti sempre includere nell'head di un documento HTML è l'elemento `title`: ```html <title>My First Webpage ``` -The `title` element is used to give webpages a human-readable title which is displayed in your webpage’s browser tab. +L'elemento `title` viene utilizzato per dare alle pagine web un titolo leggibile che viene visualizzato nella scheda della pagina web nel browser. -If you didn’t include a `title` element, the webpage’s title would default to its file name. In your case that would be `index.html`, which isn’t very meaningful for users; this would make it very difficult to find your webpage if the user has many browser tabs open. +Se non includi un elemento `title`, il titolo della pagina web diventa per impostazione predefinita il nome del file. Nel tuo caso sarà `index.html`, che non è molto significativo per gli utenti; ciò potrebbe rendere molto difficile trovare la pagina web se un utente ha molte schede aperte nel browser. -There are many more elements that can go within the `head` of an HTML document. However, for now it’s only crucial to know about the two elements you have covered here. You will introduce more elements that go into the `head` throughout the rest of the curriculum. +Ci sono molti altri elementi che possono andare all'interno dell'`head` di un documento HTML. Tuttavia, per ora è fondamentale conoscere solo i due elementi che hai affrontato qui. Introdurrai altri elementi da inserire nell'`head` per tutto il resto del curriculum. -Back in `index.html` file, let’s add a `head` element with a `charset` `meta` element and a `title` within it. The head element goes within the HTML element and should always be the first element under the opening `` tag: +Tornando al file `index.html`, aggiungi un elemento `head` con un elemento `meta` `charset` e un `title` al suo interno. L'elemento head va all'interno dell'elemento HTML e dovrebbe essere sempre il primo elemento sotto il tag di apertura ``: ```html @@ -45,19 +45,19 @@ Back in `index.html` file, let’s add a `head` element with a `charset` `meta` ## --text-- -What is the purpose of the `head` element? +Qual è lo scopo dell'elemento `head`? ## --answers-- -The `head` element is used to display all elements that are displayed on the webpage. +L'elemento `head` viene utilizzato per mostrare tutti gli elementi che vengono visualizzati sulla pagina web. --- -The `head` element is used to display important information about your webpage and is used to render web pages correctly with `meta` elements. +L'elemento `head` viene utilizzato per mostrare informazioni importanti sulla pagina web e viene utilizzato per renderizzare correttamente le pagine web tramite elementi `meta`. --- -The `head` element is used to display the header content on top of the webpage. +L'elemento `head` viene utilizzato per mostrare il contenuto dell'intestazione in cima alla pagina web. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-d.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-d.md index 302b6a95d44..e285f319b4d 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-d.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/html-boilerplate-question-d.md @@ -1,16 +1,16 @@ --- id: 637f4e3672c65bc8e73dfe23 videoId: V8UAEoOvqFg -title: HTML Boilerplate Question D +title: Boilerplate HTML Domanda D challengeType: 15 dashedName: html-boilerplate-question-d --- # --description-- -The final element needed to complete the HTML boilerplate is the `` element. This is where all the content that will be displayed to users will go - the text, images, lists, links, and so on. +L'ultimo elemento necessario per completare il boilerplate HTML è l'elemento ``. È qui che si troverà tutto il contenuto da mostrare agli utenti - testo immagini, elenchi, link e via dicendo. -To complete the boilerplate, add a `body` element to the `index.html` file. The `body` element also goes within the `html` element and is always below the `head` element, like so: +Per completare il boilerplate, aggiungi un elemento `body` al file `index.html`. Anche l'elemento `body` va all'interno dell'elemento `html` e si trova sempre al di sotto dell'elemento `head`, così: # --question-- @@ -20,27 +20,27 @@ Watch and follow along to Kevin Powell’s brilliant Building your first web pag --- -Build some muscle memory by deleting the contents of the `index.html` file and trying to write out all the boilerplate again from memory. Don’t worry if you have to peek at the lesson content the first few times if you get stuck. Just keep going until you can do it a couple of times from memory. +Crea un po' di una memoria muscolare eliminando il contenuto del file `index.html` e cercando di scrivere di nuovo tutto il boilerplate a memoria. Non preoccuparti se devi sbirciare il contenuto della lezione se le prime volte resti bloccato. Continua finché non riesci a farlo un paio di volte a memoria. --- -Run your boilerplate through this [HTML validator](https://www.freeformatter.com/html-validator.html). Validators ensure your markup is correct and are an excellent learning tool, as they provide feedback on syntax errors you may be making often and aren’t aware of, such as missing closing tags and extra spaces in your HTML. +Controlla il tuo boilerplate con questo [validatore HTML](https://www.freeformatter.com/html-validator.html). I validatori garantiscono che il tuo markup sia corretto e sono uno strumento di apprendimento eccellente, in quanto forniscono un feedback sugli errori di sintassi che potresti commettere senza rendertene conto, come tag di chiusura mancanti e spazi aggiuntivi nel tuo HTML. ## --text-- -What is the purpose of the `body` element? +Che cos'è l'elemento `body`? ## --answers-- -This is where all important information about the webpage is displayed such as the `title` and `meta` tags. +È dove vengono visualizzate tutte le informazioni importanti di una pagina web come i tag `title` e `meta`. --- -This is where you tell the browser how to render the webpage correctly. +È il posto in cui dire al browser come renderizzare correttamente la pagina. --- -This is where all content will be displayed on the page such images, text, and links. +È dove tutti i contenuti come immagini, testi e link saranno mostrati sulla pagina. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/introduction-to-html-css-question-a.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/introduction-to-html-css-question-a.md index 6c1bfb0a976..f597399d740 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/introduction-to-html-css-question-a.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/introduction-to-html-css-question-a.md @@ -1,15 +1,15 @@ --- id: 6374f208de18c50e48ba767b -title: Introduction To HTML and CSS Question A +title: Introduzione a HTML e CSS Domanda A challengeType: 15 dashedName: introduction-to-html-and-css-question-a --- # --description-- -HTML and CSS are two languages that work together to create everything that you see when you look at something on the internet. HTML is the raw data that a webpage is built out of. All the text, links, cards, lists, and buttons are created in HTML. CSS is what adds style to those plain elements. HTML puts information on a webpage, and CSS positions that information, gives it color, changes the font, and makes it look great! +HTML e CSS sono due linguaggi che lavorano insieme per creare tutto ciò che si vede quando si guarda qualcosa su internet. L'HTML è costituito dai dati grezzi di cui è fatta una pagina web. Tutto il testo, i collegamenti, le caselle, gli elenchi e i pulsanti sono creati in HTML. Il CSS è ciò che aggiunge stile a questi semplici elementi. L'HTML mette le informazioni su una pagina web e il CSS le posiziona, dà loro colore, ne cambia il carattere e le rende fantastiche! -Many helpful resources out there keep referring to HTML and CSS as programming languages, but if you want to get technical, labeling them as such is not quite accurate. This is because they are only concerned with presenting information. They are not used to program logic. JavaScript, which you will learn in the next section, is a programming language because it’s used to make webpages do things. Yet, there is quite a lot you can do with just HTML and CSS, and you will definitely need them both. Throughout our curriculum, the following lessons focus on giving you the tools you need to succeed once you reach JavaScript content. +Molte risorse utili in circolazione continuano a riferirsi a HTML e CSS come linguaggi di programmazione, ma se si vuole essere tecnici, etichettarli in questo modo non è molto accurato. Questo perché si occupano solo di presentare informazioni. Non sono utilizzati per programmare la logica. JavaScript, che imparerai nella prossima sezione, è un linguaggio di programmazione perché è usato per aggiungere funzionalità alle pagine web. Tuttavia, c'è un bel po' di roba che si può fare con solo HTML e CSS e avrai sicuramente bisogno di entrambi. Durante tutto il nostro curriculum, le seguenti lezioni si concentreranno sul darti gli strumenti necessari per farcela una volta raggiunto il contenuto JavaScript. # --question-- @@ -19,19 +19,19 @@ Read click me ``` -By default, any text wrapped with an anchor tag without a `href` attribute will look like plain text. If the `href` attribute is present, the browser will give the text a blue color and underline it to signify it is a link. +Per impostazione predefinita, qualsiasi testo avvolto con un tag di ancoraggio senza un attributo `href` apparirà come del testo semplice. Se l'attributo `href` è presente, il browser darà al testo un colore blu e lo sottolineerà per indicare che è un link. -It’s worth noting you can use anchor tags to link to any kind of resource on the internet, not just other HTML documents. You can link to videos, pdf files, images, and so on, but for the most part, you will be linking to other HTML documents. +Vale la pena notare che è possibile utilizzare tag di ancoraggio per linkare qualsiasi tipo di risorsa su internet, non solo altri documenti HTML. È possibile linkare video, file pdf, immagini e così via, ma per la maggior parte dei casi avrai a che fare con altri documenti HTML. # --question-- @@ -47,7 +47,7 @@ Watch Kevin Powell’s HTML Links video above. ## --text-- -What HTML tag is used to create a link? +Che tag HTML viene utilizzato per creare un link? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-b.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-b.md index a138268c406..47fa6a4a4ab 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-b.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-b.md @@ -1,52 +1,52 @@ --- id: 637f703572c65bc8e73dfe35 -title: Links and Images Question B +title: Link e Immagini Domanda B challengeType: 15 dashedName: links-and-images-question-b --- # --description-- -To get some practice using links and images throughout this lesson you need an HTML project to work with. +Per prendere la mano con l'utilizzo di link e immagini, in questa lezione avrai bisogno di un progetto HTML su cui lavorare. -- Create a new directory named `odin-links-and-images`. +- Crea una nuova cartella chiamata `odin-links-and-images`. -- Within that directory, create a new file named `index.html`. +- All'interno di questa cartella crea un nuovo file chiamato `index.html`. -- Fill in the usual HTML boilerplate. +- Inserisci il solito boilerplate HTML. -- finally, add the following `h1` to the `body`: `

Homepage

` +- infine, aggiungi il seguente `h1` al `body`: `

Homepage

` -## Anchor Elements -To create a link in HTML, you use the anchor element. An anchor element is defined by wrapping the text or another HTML element you want to be a link with an `` tag. Add the following to the `body` of the `index.html` page you created and open it in the browser: +## Elementi di ancoraggio +Per creare un link in HTML, si utilizza l'elemento di ancoraggio. Un elemento di ancoraggio viene definito racchiudendo in un tag `` il testo o un altro elemento HTML che si desidera trasformare in un link. Aggiungi quanto segue al `body` della pagina `index.html` che hai creato e aprila nel browser: ```html click me ``` -You may have noticed that clicking this link doesn’t do anything. This is because an anchor tag on its own won’t know where you want to link to. You have to tell it a destination to go to. You do this by using an HTML attribute. An HTML attribute gives additional information to an HTML element and always goes in the element’s opening tag. An attribute is usually made up of two parts: a name, and a value; however, not all attributes require a value. In your case, you need to add a `href` (hyperlink reference) attribute to the opening anchor tag. The value of the `href` attribute is the destination you want your link to go to. Add the following `href` attribute to the anchor element you created previously and try clicking it again, don’t forget to refresh the browser so the new changes can be applied. +Potresti aver notato che se fai clic su questo link non accade nulla. Questo perché un tag di ancoraggio da solo non sa a cosa vuoi collegarti. Occorre fornirgli una destinazione verso cui andare. E lo si fa utilizzando un attributo HTML. Un attributo HTML fornisce informazioni aggiuntive a un elemento HTML e va sempre nel tag di apertura dell'elemento. Di solito, un attributo è composto da due parti: un nome e un valore; tuttavia, non tutti gli attributi richiedono un valore. Nel tuo caso, devi aggiungere un attributo `href` (hyperlink reference) al tag di ancoraggio di apertura. Il valore dell'attributo `href` corrisponde alla destinazione del collegamento. Aggiungi il seguente attributo `href` all'elemento di ancoraggio che hai creato in precedenza e riprova a cliccarlo, non dimenticare di aggiornare il browser in modo che le nuove modifiche possano essere applicate. ```html click me ``` -By default, any text wrapped with an anchor tag without a `href` attribute will look like plain text. If the `href` attribute is present, the browser will give the text a blue color and underline it to signify it is a link. It’s worth noting you can use anchor tags to link to any kind of resource on the internet, not just other HTML documents. You can link to videos, pdf files, images, and so on, but for the most part, you will be linking to other HTML documents. +Per impostazione predefinita, qualsiasi testo avvolto con un tag di ancoraggio senza un attributo `href` apparirà come del testo semplice. Se l'attributo `href` è presente, il browser darà al testo un colore blu e lo sottolineerà per indicare che è un link. Vale la pena notare che è possibile utilizzare tag di ancoraggio per linkare qualsiasi tipo di risorsa su internet, non solo altri documenti HTML. È possibile linkare video, file pdf, immagini e così via, ma per la maggior parte dei casi avrai a che fare con altri documenti HTML. # --question-- ## --text-- -What is an attribute? +Cos'è un attributo? ## --answers-- -An HTML attribute gives additional information to an HTML element and always goes in the element’s closing tag. +Un attributo HTML fornisce informazioni aggiuntive a un elemento HTML e va sempre nel tag di chiusura dell'elemento. --- -An HTML attribute is used to tell the browser what the element contains. +Un attributo HTML viene utilizzato per dire al browser cosa contiene l'elemento. --- -An HTML attribute gives additional information to an HTML element and always goes in the element’s opening tag. +Un attributo HTML fornisce informazioni aggiuntive a un elemento HTML e va sempre nel tag di apertura dell'elemento. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-c.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-c.md index 8863b087456..f587116f75c 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-c.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-c.md @@ -1,42 +1,42 @@ --- id: 637f703072c65bc8e73dfe34 -title: Links and Images Question C +title: Link e Immagini Domanda C challengeType: 15 dashedName: links-and-images-question-c --- # --description-- -To get some practice using links and images throughout this lesson you need an HTML project to work with. +Per prendere la mano con l'utilizzo di link e immagini, in questa lezione avrai bisogno di un progetto HTML su cui lavorare. -- Create a new directory named `odin-links-and-images`. +- Crea una nuova cartella chiamata `odin-links-and-images`. -- Within that directory, create a new file named `index.html`. +- All'interno di questa cartella crea un nuovo file chiamato `index.html`. -- Fill in the usual HTML boilerplate. +- Inserisci il solito boilerplate HTML. -- finally, add the following `h1` to the `body`: `

Homepage

` +- infine, aggiungi il seguente `h1` al `body`: `

Homepage

` -## Anchor Elements -To create a link in HTML, you use the anchor element. An anchor element is defined by wrapping the text or another HTML element you want to be a link with an `` tag. Add the following to the `body` of the `index.html` page you created and open it in the browser: +## Elementi di ancoraggio +Per creare un link in HTML, si utilizza l'elemento di ancoraggio. Un elemento di ancoraggio viene definito racchiudendo in un tag `` il testo o un altro elemento HTML che si desidera trasformare in un link. Aggiungi quanto segue al `body` della pagina `index.html` che hai creato e aprila nel browser: ```html click me ``` -You may have noticed that clicking this link doesn’t do anything. This is because an anchor tag on its own won’t know where you want to link to. You have to tell it a destination to go to. You do this by using an HTML attribute. An HTML attribute gives additional information to an HTML element and always goes in the element’s opening tag. An attribute is usually made up of two parts: a name, and a value; however, not all attributes require a value. In your case, you need to add a `href` (hyperlink reference) attribute to the opening anchor tag. The value of the `href` attribute is the destination you want your link to go to. Add the following `href` attribute to the anchor element you created previously and try clicking it again, don’t forget to refresh the browser so the new changes can be applied. +Potresti aver notato che se fai clic su questo link non accade nulla. Questo perché un tag di ancoraggio da solo non sa a cosa vuoi collegarti. Occorre fornirgli una destinazione verso cui andare. E lo si fa utilizzando un attributo HTML. Un attributo HTML fornisce informazioni aggiuntive a un elemento HTML e va sempre nel tag di apertura dell'elemento. Di solito, un attributo è composto da due parti: un nome e un valore; tuttavia, non tutti gli attributi richiedono un valore. Nel tuo caso, devi aggiungere un attributo `href` (hyperlink reference) al tag di ancoraggio di apertura. Il valore dell'attributo `href` corrisponde alla destinazione del collegamento. Aggiungi il seguente attributo `href` all'elemento di ancoraggio che hai creato in precedenza e riprova a cliccarlo, non dimenticare di aggiornare il browser in modo che le nuove modifiche possano essere applicate. ```html click me ``` -By default, any text wrapped with an anchor tag without a `href` attribute will look like plain text. If the `href` attribute is present, the browser will give the text a blue color and underline it to signify it is a link. It’s worth noting you can use anchor tags to link to any kind of resource on the internet, not just other HTML documents. You can link to videos, pdf files, images, and so on, but for the most part, you will be linking to other HTML documents. +Per impostazione predefinita, qualsiasi testo avvolto con un tag di ancoraggio senza un attributo `href` apparirà come del testo semplice. Se l'attributo `href` è presente, il browser darà al testo un colore blu e lo sottolineerà per indicare che è un link. Vale la pena notare che è possibile utilizzare tag di ancoraggio per linkare qualsiasi tipo di risorsa su internet, non solo altri documenti HTML. È possibile linkare video, file pdf, immagini e così via, ma per la maggior parte dei casi avrai a che fare con altri documenti HTML. # --question-- ## --text-- -What attribute tells links where to go to? +Quale attributo dice ai link dove andare? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-d.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-d.md index 37eebffbabf..610bf9d47c9 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-d.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-d.md @@ -1,7 +1,7 @@ --- id: 637f702872c65bc8e73dfe33 videoId: ta3Oxx7Yqbo -title: Links and Images Question D +title: Link e Immagini Domanda D challengeType: 15 dashedName: links-and-images-question-d --- @@ -9,26 +9,26 @@ dashedName: links-and-images-question-d # --description-- -Generally, there are two kinds of links you will create: +Generalmente, ci sono due tipi di link che puoi creare: -- Links to pages on other websites on the internet +- Link a pagine o altri siti web su internet -- Links to pages located on your own websites +- Link a pagine situate sul tuo sito web -## Absolute Links -Links to pages on other websites on the internet are called absolute links. A typical absolute link will be made up of the following parts: `protocol://domain/path`. An absolute link will always contain the protocol and domain of the destination. +## Link assoluti +I link alle pagine di altri siti web su internet sono chiamati link assoluti. Un tipico link assoluto è costituito dalle seguenti parti: `protocol://domain/path`. Un link assoluto conterrà sempre il protocollo e il dominio della destinazione. -You’ve already seen an absolute link in action. The link you created to The Odin Project’s About page earlier was an absolute link as it contains the protocol and domain. +Hai già visto un link assoluto in azione. Il link alla pagina About di The Odin Project che hai creato in precedenza era un link assoluto, in quanto contiene il protocollo e il dominio. `https://www.theodinproject.com/about` -## Relative Links -Links to other pages within your own website are called relative links. Relative links do not include the domain name, since it is another page on the same site, it assumes the domain name will be the same as the page you created the link on. +## Link relativi +I link ad altre pagine all'interno del tuo sito web sono chiamati link relativi. I link relativi non includono il nome del dominio, poiché si tratta di un'altra pagina sullo stesso sito e si suppone che il nome del dominio sia lo stesso della pagina su cui è stato creato il collegamento. -Relative links only include the file path to the other page, relative to the page you are creating the link on. This is quite abstract, let’s see this in action using an example. +I link relativi includono solo il percorso del file all'altra pagina, rispetto alla pagina in cui si sta creando il collegamento. Piuttosto astratto, quindi vediamo come funziona con un esempio. -Within the `odin-links-and-images` directory, create another HTML file named `about.html` and paste the following code into it: +All'interno della cartella `odin-links-and-images`, crea un altro file HTML chiamato `about.html` e incolla al suo interno il seguente codice: ```html @@ -44,7 +44,7 @@ Within the `odin-links-and-images` directory, create another HTML file named `ab ``` -Back in the `index` page, add the following anchor element to create a link to the `about` page: +Tornando alla pagina `index`, aggiungi il seguente elemento di ancoraggio per creare un link alla pagina `about`: ```html @@ -55,17 +55,17 @@ Back in the `index` page, add the following anchor element to create a link to t ``` -Open the `index.html` file in a browser and click on the about link to make sure it is all wired together correctly. Clicking the link should go to the `about` page you just created. +Apri il file `index.html` nel browser e clicca sul link ad about per assicurarti che tutto sia collegato correttamente. Cliccare sul link dovrebbe portarti alla pagina `about` che hai appena creato. -This works because the `index` and `about` page are in the same directory. That means you can simply use its name (`about.html`) as the link’s `href` value. +Questo funziona perché le pagine `index` e `about` sono nella stessa cartella. Ciò vuol dire che puoi usare semplicemente il suo nome (`about.html`) come valore di `href` del link. -But you will usually want to organize your website directories a little better. Normally you would only have the `index.html` at the root directory and all other HTML files in their own directory. +Ma di solito è bene organizzare le cartelle di un sito un po' meglio. Normalmente dovresti avere solo il file `index.html` nella cartella root e tutti gli altri file HTML nella propria cartella. -Create a directory named `pages` within the `odin-links-and-images` directory and move the `about.html` file into this new directory. +Crea una cartella chiamata `pages` all'interno della cartella `odin-links-and-images` e sposta il file `about.html` nella nuova cartella. -Refresh the `index` page in the browser and then click on the `about` link. It will now be broken. This is because the location of the `about` page file has changed. +Ricarica la pagina `index` nel browser e poi clicca sul link ad `about`. Adesso non funzionerà. Questo perché la posizione del file della pagina `about` è cambiata. -To fix this, you just need to update the `about` link `href` value to include the `pages/` directory since that is the new location of the `about.html` file relative to the `index.html` file. +Per risolvere questo problema, devi solo aggiornare il valore `href` del link ad `about` includendo la cartella `pages/` dato che questa è la nuova posizione del file `about.html` relativa al file `index.html`. ```html @@ -74,9 +74,9 @@ To fix this, you just need to update the `about` link `href` value to include th ``` -Refresh the `index` page in the browser and try clicking the `about` link again, it should now be back in working order. +Ricarica la pagina `index` nel browser e prova a cliccare ancora sul link ad `about`, adesso dovrebbe essere tornato in funzione. -In many cases, this will work just fine; however, you can still run into unexpected issues with this approach. Prepending `./` before the link will in most cases prevent such issues. By adding `./` you are specifying to your code that it should start looking for the file/directory relative to the **current** directory. +In molti casi, sarà sufficiente; tuttavia, con questo approccio potresti ancora imbatterti in problemi inaspettati. Anteporre `./` al link preverrà tali errori nella maggior parte dei casi. Aggiungendo `./` stai specificando al tuo codice che dovrebbe iniziare a cercare il file o la cartella rispetto alla cartella **attuale**. ```html @@ -93,19 +93,19 @@ Watch Kevin Powell’s HTML File Structure video above. ## --text-- -What is the difference between an absolute and a relative link? +Qual è la differenza tra un link assoluto e un link relativo? ## --answers-- -An absolute link is a link to another page on the current website. A relative link is a link to another website. +Un link assoluto è un link a un'altra pagina del sito corrente. Un link relativo è un link a un altro sito web. --- -An absolute link is a link to another website. A relative link is a link another page on the current website. +Un link assoluto è un link a un altro sito web. Un link relativo è un link un'altra pagina sul sito web corrente. --- -There is no difference between absolute and relative links. +Non c'è differenza tra i link assoluti e relativi. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-e.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-e.md index ae008078088..4a28b5faae1 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-e.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-e.md @@ -1,32 +1,32 @@ --- id: 637f702372c65bc8e73dfe32 videoId: 0xoztJCHpbQ -title: Links and Images Question E +title: Link e Immagini Domanda E challengeType: 15 dashedName: links-and-images-question-e --- # --description-- -Websites would be fairly boring if they could only display text. Luckily HTML provides a wide variety of elements for displaying all sorts of different media. The most widely used of these is the image element. +I siti web sarebbero abbastanza noiosi se si potesse visualizzare solo del testo. Fortunatamente l'HTML fornisce una grande varietà di elementi per la visualizzazione di contenuti di ogni sorta. Tra questi il più utilizzato è l'elemento immagine. -To display an image in HTML you use the `` element. Unlike the other elements you have encountered, the `` element is self-closing. Empty, self-closing HTML elements do not need a closing tag. +Per visualizzare un'immagine in HTML si utilizza l'elemento ``. A differenza degli altri elementi che hai incontrato, l'elemento `` è a chiusura automatica. Gli elementi HTML vuoti, o a chiusura automatica, non necessitano di un tag di chiusura. -Instead of wrapping content with an opening and closing tag, it embeds an image into the page using a `src` attribute which tells the browser where the image file is located. The `src` attribute works much like the `href` attribute for anchor tags. It can embed an image using both absolute and relative paths. +Invece di racchiudere il contenuto tra un tag di apertura e uno di chiusura, incorpora un'immagine nella pagina usando un attributo `src` che indica al browser dove si trova il file dell'immagine. L'attributo `src` funziona in modo simile all'attributo `href` per i tag di ancoraggio. Può incorporare un'immagine usando sia percorsi assoluti che relativi. -For example, using an absolute path you can display an image located on The Odin Project site: +Ad esempio, utilizzando un percorso assoluto è possibile visualizzare un'immagine situata sul sito di The Odin Project: -To use images that you have on your own websites, you can use a relative path. +Per utilizzare le immagini che hai sui tuoi siti web, puoi usare un percorso relativo. -- Create a new directory named `images` within the `odin-links-and-images` project. +- Crea una nuova cartella chiamata `images` all'interno del progetto `odin-links-and-images`. -- Next, download [this image](https://unsplash.com/photos/Mv9hjnEUHR4/download?force=true&w=640) and move it into the `images` directory you just created. +- Poi scarica [questa immagine](https://unsplash.com/photos/Mv9hjnEUHR4/download?force=true&w=640) e spostala nella cartella `images` che hai appena creato. -- Rename the image to `dog.jpg`. +- Rinomina l'immagine in `dog.jpg`. -Finally add the image to the `index.html` file: +Infine aggiungi l'immagine al file `index.html`: ```html @@ -39,36 +39,36 @@ Finally add the image to the `index.html` file: ``` -Save the `index.html` file and open it in a browser to view Charles in all his glory. +Salva il file `index.html` e aprilo in un browser per vedere Charles in tutta la sua gloria. -## Parent Directories +## Cartelle genitori -What if you want to use the dog image in the `about` page? You would first have to go up one level out of the pages directory into its parent directory so you could then access the images directory. +E se volessi utilizzare l'immagine del cane nella pagina `about`? Dovresti salire di un livello dalla cartella pages fino alla sua cartella genitore in modo da poter accedere alla cartella images. -To go to the parent directory you need to use two dots in the relative filepath like this: `../.` Let’s see this in action, within the `body` of the `about.html` file, add the following image below the heading you added earlier: +Per passare alla cartella genitore devi usare due punti nel percorso relativo, così: `../.` Vediamo come funziona: all'interno del `body` del file `about.html`, aggiungi la seguente immagine sotto l'intestazione che hai aggiunto precedentemente: ```html ``` -To break this down: +Analizziamo questo passaggio: -- First, you are going to the parent directory of the pages directory which is `odin-links-and-images`. +- Prima di tutto, stai passando alla cartella genitore della cartella pages, che è `odin-links-and-images`. -- Then, from the parent directory, you can go into the `images` directory. +- Poi, dalla cartella genitore puoi passare alla cartella `images`. -- Finally, you can access the `dog.jpg` file. +- Infine, puoi accedere al file `dog.jpg`. -Using the metaphor we used earlier, using `../` in a filepath is kind of like stepping out from the room you are currently in to the main hallway so you can go to another room. +Usando la metafora che abbiamo utilizzato prima, usare `../` nel percorso è un po' come uscire dalla stanza in cui ti trovi per andare nel corridoio e poter accedere a un'altra stanza. -## `Alt` attribute +## Attributo `Alt` -Besides the `src` attribute, every image element should also have an `alt` (alternative text) attribute. +Oltre all'attributo `src`, ogni elemento di immagine dovrebbe avere anche un attributo `alt` (testo alternativo). -The `alt` attribute is used to describe an image. It will be used in place of the image if it cannot be loaded. It is also used with screen readers to describe what the image is to visually impaired users. +L'attributo `alt` viene usato per descrivere un'immagine. Viene usato al posto dell'immagine nel caso questa non possa essere caricata. Viene utilizzato anche dai lettori di schermo per descrivere l'immagine agli utenti ipovedenti. -This is how the The Odin Project logo example you used earlier looks with an `alt` attribute included: +Ecco come risulta l'esempio che hai usato precedentemente del logo di The Odin Project con un attributo `alt` incluso: # --question-- @@ -79,7 +79,7 @@ Watch Kevin Powell’s HTML Images Video above. ## --text-- -Which tag is used to display an image? +Quale tag è usato per mostrare un'immagine? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-f.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-f.md index e1af2d6a659..53643179ddc 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-f.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-f.md @@ -1,31 +1,31 @@ --- id: 637f701c72c65bc8e73dfe31 -title: Links and Images Question F +title: Link e Immagini Domanda F challengeType: 15 dashedName: links-and-images-question-f --- # --description-- -Websites would be fairly boring if they could only display text. Luckily HTML provides a wide variety of elements for displaying all sorts of different media. The most widely used of these is the image element. +I siti web sarebbero abbastanza noiosi se si potesse visualizzare solo del testo. Fortunatamente l'HTML fornisce una grande varietà di elementi per la visualizzazione di contenuti di ogni sorta. Tra questi il più utilizzato è l'elemento immagine. -To display an image in HTML you use the `` element. Unlike the other elements you have encountered, the `` element is self-closing. Empty, self-closing HTML elements do not need a closing tag. +Per visualizzare un'immagine in HTML si utilizza l'elemento ``. A differenza degli altri elementi che hai incontrato, l'elemento `` è a chiusura automatica. Gli elementi HTML vuoti, o a chiusura automatica, non necessitano di un tag di chiusura. -Instead of wrapping content with an opening and closing tag, it embeds an image into the page using a `src` attribute which tells the browser where the image file is located. The `src` attribute works much like the `href` attribute for anchor tags. It can embed an image using both absolute and relative paths. +Invece di racchiudere il contenuto tra un tag di apertura e uno di chiusura, incorpora un'immagine nella pagina usando un attributo `src` che indica al browser dove si trova il file dell'immagine. L'attributo `src` funziona in modo simile all'attributo `href` per i tag di ancoraggio. Può incorporare un'immagine usando sia percorsi assoluti che relativi. -For example, using an absolute path you can display an image located on The Odin Project site: +Ad esempio, utilizzando un percorso assoluto è possibile visualizzare un'immagine situata sul sito di The Odin Project: -To use images that you have on your own websites, you can use a relative path. +Per utilizzare le immagini che hai sui tuoi siti web, puoi usare un percorso relativo. -- Create a new directory named `images` within the `odin-links-and-images` project. +- Crea una nuova cartella chiamata `images` all'interno del progetto `odin-links-and-images`. -- Next, download [this image](https://unsplash.com/photos/Mv9hjnEUHR4/download?force=true&w=640) and move it into the images directory you just created. +- Poi scarica [questa immagine](https://unsplash.com/photos/Mv9hjnEUHR4/download?force=true&w=640) e spostala nella cartella images che hai appena creato. -- Rename the image to `dog.jpg`. +- Rinomina l'immagine in `dog.jpg`. -Finally add the image to the `index.html` file: +Infine aggiungi l'immagine al file `index.html`: ```html @@ -38,55 +38,55 @@ Finally add the image to the `index.html` file: ``` -Save the `index.html` file and open it in a browser to view Charles in all his glory. +Salva il file `index.html` e aprilo in un browser per vedere Charles in tutta la sua gloria. -## Parent Directories +## Cartelle genitori -What if you want to use the dog image in the `about` page? You would first have to go up one level out of the pages directory into its parent directory so you could then access the images directory. +E se volessi utilizzare l'immagine del cane nella pagina `about`? Dovresti salire di un livello dalla cartella pages fino alla sua cartella genitore in modo da poter accedere alla cartella images. -To go to the parent directory you need to use two dots in the relative filepath like this: `../.` Let’s see this in action, within the `body` of the `about.html` file, add the following image below the heading you added earlier: +Per passare alla cartella genitore devi usare due punti nel percorso relativo, così: `../.` Vediamo come funziona: all'interno del `body` del file `about.html`, aggiungi la seguente immagine sotto l'intestazione che hai aggiunto precedentemente: ```html ``` -To break this down: +Analizziamo questo passaggio: -- First, you are going to the parent directory of the pages directory which is `odin-links-and-images`. +- Prima di tutto, stai passando alla cartella genitore della cartella pages, che è `odin-links-and-images`. -- Then, from the parent directory, you can go into the `images` directory. +- Poi, dalla cartella genitore puoi passare alla cartella `images`. -- Finally, you can access the `dog.jpg` file. +- Infine, puoi accedere al file `dog.jpg`. -Using the metaphor we used earlier, using `../` in a filepath is kind of like stepping out from the room you are currently in to the main hallway so you can go to another room. +Usando la metafora che abbiamo utilizzato prima, usare `../` nel percorso è un po' come uscire dalla stanza in cui ti trovi per andare nel corridoio e poter accedere a un'altra stanza. -## Alt attribute +## Attributo alt -Besides the `src` attribute, every image element should also have an `alt` (alternative text) attribute. +Oltre all'attributo `src`, ogni elemento di immagine dovrebbe avere anche un attributo `alt` (testo alternativo). -The `alt` attribute is used to describe an image. It will be used in place of the image if it cannot be loaded. It is also used with screen readers to describe what the image is to visually impaired users. +L'attributo `alt` viene usato per descrivere un'immagine. Viene usato al posto dell'immagine nel caso questa non possa essere caricata. Viene utilizzato anche dai lettori di schermo per descrivere l'immagine agli utenti ipovedenti. -This is how the The Odin Project logo example you used earlier looks with an alt attribute included: +Ecco come risulta l'esempio che hai usato precedentemente del logo di The Odin Project con un attributo alt incluso: # --question-- ## --text-- -What two attributes do images always need to have? +Di quali due attributi hanno sempre bisogno le immagini? ## --answers-- -`href` and `alt` +`href` e `alt` --- -`name` and `href` +`name` e `href` --- -`alt` and `src` +`alt` e `src` ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-g.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-g.md index 5bc84fa6c96..92a557776b8 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-g.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-g.md @@ -1,31 +1,31 @@ --- id: 637f701572c65bc8e73dfe30 -title: Links and Images Question G +title: Link e Immagini Domanda G challengeType: 15 dashedName: links-and-images-question-g --- # --description-- -Websites would be fairly boring if they could only display text. Luckily HTML provides a wide variety of elements for displaying all sorts of different media. The most widely used of these is the image element. +I siti web sarebbero abbastanza noiosi se si potesse visualizzare solo del testo. Fortunatamente l'HTML fornisce una grande varietà di elementi per la visualizzazione di contenuti di ogni sorta. Tra questi il più utilizzato è l'elemento immagine. -To display an image in HTML you use the `` element. Unlike the other elements you have encountered, the `` element is self-closing. Empty, self-closing HTML elements do not need a closing tag. +Per visualizzare un'immagine in HTML si utilizza l'elemento ``. A differenza degli altri elementi che hai incontrato, l'elemento `` è a chiusura automatica. Gli elementi HTML vuoti, o a chiusura automatica, non necessitano di un tag di chiusura. -Instead of wrapping content with an opening and closing tag, it embeds an image into the page using a `src` attribute which tells the browser where the image file is located. The `src` attribute works much like the `href` attribute for anchor tags. It can embed an image using both absolute and relative paths. +Invece di racchiudere il contenuto tra un tag di apertura e uno di chiusura, incorpora un'immagine nella pagina usando un attributo `src` che indica al browser dove si trova il file dell'immagine. L'attributo `src` funziona in modo simile all'attributo `href` per i tag di ancoraggio. Può incorporare un'immagine usando sia percorsi assoluti che relativi. -For example, using an absolute path you can display an image located on The Odin Project site: +Ad esempio, utilizzando un percorso assoluto è possibile visualizzare un'immagine situata sul sito di The Odin Project: -To use images that you have on your own websites, you can use a relative path. +Per utilizzare le immagini che hai sui tuoi siti web, puoi usare un percorso relativo. -- Create a new directory named `images` within the `odin-links-and-images` project. +- Crea una nuova cartella chiamata `images` all'interno del progetto `odin-links-and-images`. -- Next, download [this image](https://unsplash.com/photos/Mv9hjnEUHR4/download?force=true&w=640) and move it into the images directory you just created. +- Poi scarica [questa immagine](https://unsplash.com/photos/Mv9hjnEUHR4/download?force=true&w=640) e spostala nella cartella images che hai appena creato. -- Rename the image to `dog.jpg`. +- Rinomina l'immagine in `dog.jpg`. -Finally add the image to the `index.html` file: +Infine aggiungi l'immagine al file `index.html`: ```html @@ -38,43 +38,43 @@ Finally add the image to the `index.html` file: ``` -Save the `index.html` file and open it in a browser to view Charles in all his glory. +Salva il file `index.html` e aprilo in un browser per vedere Charles in tutta la sua gloria. -## Parent Directories +## Cartelle genitori -What if you want to use the dog image in the `about` page? You would first have to go up one level out of the pages directory into its parent directory so you could then access the images directory. +E se volessi utilizzare l'immagine del cane nella pagina `about`? Dovresti salire di un livello dalla cartella pages fino alla sua cartella genitore in modo da poter accedere alla cartella images. -To go to the parent directory you need to use two dots in the relative filepath like this: `../.` Let’s see this in action, within the `body` of the `about.html` file, add the following image below the heading you added earlier: +Per passare alla cartella genitore devi usare due punti nel percorso relativo, così: `../.` Vediamo come funziona: all'interno del `body` del file `about.html`, aggiungi la seguente immagine sotto l'intestazione che hai aggiunto precedentemente: ```html ``` -To break this down: +Analizziamo questo passaggio: -- First, you are going to the parent directory of the pages directory which is `odin-links-and-images`. +- Prima di tutto, stai passando alla cartella genitore della cartella pages, che è `odin-links-and-images`. -- Then, from the parent directory, you can go into the `images` directory. +- Poi, dalla cartella genitore puoi passare alla cartella `images`. -- Finally, you can access the `dog.jpg` file. +- Infine, puoi accedere al file `dog.jpg`. -Using the metaphor we used earlier, using `../` in a filepath is kind of like stepping out from the room you are currently in to the main hallway so you can go to another room. +Usando la metafora che abbiamo utilizzato prima, usare `../` nel percorso è un po' come uscire dalla stanza in cui ti trovi per andare nel corridoio e poter accedere a un'altra stanza. -## Alt attribute +## Attributo alt -Besides the `src` attribute, every image element should also have an `alt` (alternative text) attribute. +Oltre all'attributo `src`, ogni elemento di immagine dovrebbe avere anche un attributo `alt` (testo alternativo). -The `alt` attribute is used to describe an image. It will be used in place of the image if it cannot be loaded. It is also used with screen readers to describe what the image is to visually impaired users. +L'attributo `alt` viene usato per descrivere un'immagine. Viene usato al posto dell'immagine nel caso questa non possa essere caricata. Viene utilizzato anche dai lettori di schermo per descrivere l'immagine agli utenti ipovedenti. -This is how the The Odin Project logo example you used earlier looks with an alt attribute included: +Ecco come risulta l'esempio che hai usato precedentemente del logo di The Odin Project con un attributo alt incluso: # --question-- ## --text-- -How do you access a parent directory in a filepath? +Come si accede a una cartella genitore in un percorso? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-h.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-h.md index 71157081ae7..7c04f58b64a 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-h.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/links-and-images-question-h.md @@ -1,31 +1,31 @@ --- id: 637f700b72c65bc8e73dfe2f -title: Links and Images Question H +title: Link e Immagini Domanda H challengeType: 15 dashedName: links-and-images-question-h --- # --description-- -Websites would be fairly boring if they could only display text. Luckily HTML provides a wide variety of elements for displaying all sorts of different media. The most widely used of these is the image element. +I siti web sarebbero abbastanza noiosi se si potesse visualizzare solo del testo. Fortunatamente l'HTML fornisce una grande varietà di elementi per la visualizzazione di contenuti di ogni sorta. Tra questi il più utilizzato è l'elemento immagine. -To display an image in HTML you use the `` element. Unlike the other elements you have encountered, the `` element is self-closing. Empty, self-closing HTML elements do not need a closing tag. +Per visualizzare un'immagine in HTML si utilizza l'elemento ``. A differenza degli altri elementi che hai incontrato, l'elemento `` è a chiusura automatica. Gli elementi HTML vuoti, o a chiusura automatica, non necessitano di un tag di chiusura. -Instead of wrapping content with an opening and closing tag, it embeds an image into the page using a `src` attribute which tells the browser where the image file is located. The `src` attribute works much like the `href` attribute for anchor tags. It can embed an image using both absolute and relative paths. +Invece di racchiudere il contenuto tra un tag di apertura e uno di chiusura, incorpora un'immagine nella pagina usando un attributo `src` che indica al browser dove si trova il file dell'immagine. L'attributo `src` funziona in modo simile all'attributo `href` per i tag di ancoraggio. Può incorporare un'immagine usando sia percorsi assoluti che relativi. -For example, using an absolute path you can display an image located on The Odin Project site: +Ad esempio, utilizzando un percorso assoluto è possibile visualizzare un'immagine situata sul sito di The Odin Project: -To use images that you have on your own websites, you can use a relative path. +Per utilizzare le immagini che hai sui tuoi siti web, puoi usare un percorso relativo. -- Create a new directory named `images` within the `odin-links-and-images` project. +- Crea una nuova cartella chiamata `images` all'interno del progetto `odin-links-and-images`. -- Next, download [this image](https://unsplash.com/photos/Mv9hjnEUHR4/download?force=true&w=640) and move it into the images directory you just created. +- Poi scarica [questa immagine](https://unsplash.com/photos/Mv9hjnEUHR4/download?force=true&w=640) e spostala nella cartella images che hai appena creato. -- Rename the image to `dog.jpg`. +- Rinomina l'immagine in `dog.jpg`. -Finally add the image to the `index.html` file: +Infine aggiungi l'immagine al file `index.html`: ```html @@ -38,36 +38,36 @@ Finally add the image to the `index.html` file: ``` -Save the `index.html` file and open it in a browser to view Charles in all his glory. +Salva il file `index.html` e aprilo in un browser per vedere Charles in tutta la sua gloria. -## Parent Directories +## Cartelle genitori -What if you want to use the dog image in the `about` page? You would first have to go up one level out of the pages directory into its parent directory so you could then access the images directory. +E se volessi utilizzare l'immagine del cane nella pagina `about`? Dovresti salire di un livello dalla cartella pages fino alla sua cartella genitore in modo da poter accedere alla cartella images. -To go to the parent directory you need to use two dots in the relative filepath like this: `../.` Let’s see this in action, within the `body` of the `about.html` file, add the following image below the heading you added earlier: +Per passare alla cartella genitore devi usare due punti nel percorso relativo, così: `../.` Vediamo come funziona: all'interno del `body` del file `about.html`, aggiungi la seguente immagine sotto l'intestazione che hai aggiunto precedentemente: ```html ``` -To break this down: +Analizziamo questo passaggio: -- First, you are going to the parent directory of the pages directory which is `odin-links-and-images`. +- Prima di tutto, stai passando alla cartella genitore della cartella pages, che è `odin-links-and-images`. -- Then, from the parent directory, you can go into the `images` directory. +- Poi, dalla cartella genitore puoi passare alla cartella `images`. -- Finally, you can access the `dog.jpg` file. +- Infine, puoi accedere al file `dog.jpg`. -Using the metaphor we used earlier, using `../` in a filepath is kind of like stepping out from the room you are currently in to the main hallway so you can go to another room. +Usando la metafora che abbiamo utilizzato prima, usare `../` nel percorso è un po' come uscire dalla stanza in cui ti trovi per andare nel corridoio e poter accedere a un'altra stanza. -## Alt attribute +## Attributo alt -Besides the `src` attribute, every image element should also have an `alt` (alternative text) attribute. +Oltre all'attributo `src`, ogni elemento di immagine dovrebbe avere anche un attributo `alt` (testo alternativo). -The `alt` attribute is used to describe an image. It will be used in place of the image if it cannot be loaded. It is also used with screen readers to describe what the image is to visually impaired users. +L'attributo `alt` viene usato per descrivere un'immagine. Viene usato al posto dell'immagine nel caso questa non possa essere caricata. Viene utilizzato anche dai lettori di schermo per descrivere l'immagine agli utenti ipovedenti. -This is how the The Odin Project logo example you used earlier looks with an alt attribute included: +Ecco come risulta l'esempio che hai usato precedentemente del logo di The Odin Project con un attributo alt incluso: # --question-- @@ -78,19 +78,19 @@ Read about the -If you instead want to create a list of items where the order does matter, like step-by-step instructions for a recipe, or your top 10 favorite TV shows, then you can use an ordered list. +Se invece vuoi creare una lista di elementi in cui l'ordine conta, come delle istruzioni passo passo per una ricetta o la top 10 dei tuoi show televisivi preferiti, allora puoi usare una lista ordinata. -Ordered lists are created using the `
    ` element. Each individual item in them is again created using the list item element `
  1. `. However, each list item in an ordered list begins with a number instead: +Le liste ordinate (ordered list) vengono create utilizzando l'elemento `
      `. Ogni elemento al loro interno viene sempre creato con un elemento list item `
    1. `. Però ogni elemento di una lista ordinata inizia con un numero: @@ -30,23 +30,23 @@ Watch the first three minutes of Kevin Powell's video on Ordered and Unordered l --- -Make an unordered shopping list of your favorite foods. +Crea una lista della spesa non ordinata dei tuoi cibi preferiti. --- -Make an ordered list of todo’s you need to get done today. +Crea una lista ordinata delle attività da portare a termine oggi. --- -Make an unordered list of places you’d like to visit someday. +Crea una lista non ordinata di luoghi che vorresti visitare un giorno. --- -Make an ordered list of your all time top 5 favorite video games or movies. +Crea una lista ordinata dei tuoi 5 videogiochi o film preferiti di tutti i tempi. ## --text-- -What HTML tag is used to create an unordered list? +Che tag HTML viene utilizzato per creare una lista non ordinata? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/understand-ordered-and-unordered-list-question-b.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/understand-ordered-and-unordered-list-question-b.md index 67e79f0ccb9..07c11e42d6d 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/understand-ordered-and-unordered-list-question-b.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/understand-ordered-and-unordered-list-question-b.md @@ -1,23 +1,23 @@ --- id: 637f4e4672c65bc8e73dfe25 -title: Understand Ordered and Unordered List Question B +title: Capire le Liste Ordinate e Non Ordinate Domanda B challengeType: 15 dashedName: understand-ordered-and-unordered-list-question-b --- # --description-- -If you want to have a list of items where the order doesn’t matter, like a shopping list of items that can be bought in any order, then you can use an unordered list. +Se vuoi creare una lista di elementi in cui l'ordine non conta, come una lista della spesa in cui gli elementi possono essere comprati in qualsiasi ordine, allora puoi usare una lista non ordinata. -Unordered lists are created using the `
        ` element, and each item within the list is created using the list item element `
      • `. +Le liste non ordinate (unordered list) vengono create usando l'elemento `
          ` e ogni elemento della lista viene creato usando l'elemento list item `
        • `. -Each list item in an unordered list begins with a bullet point: +Ogni elemento della lista in una lista non ordinata inizia con un punto di elenco: -If you instead want to create a list of items where the order does matter, like step-by-step instructions for a recipe, or your top 10 favorite TV shows, then you can use an ordered list. +Se invece vuoi creare una lista di elementi in cui l'ordine conta, come delle istruzioni passo passo per una ricetta o la top 10 dei tuoi show televisivi preferiti, allora puoi usare una lista ordinata. -Ordered lists are created using the `
            ` element. Each individual item in them is again created using the list item element `
          1. `. However, each list item in an ordered list begins with a number instead: +Le liste ordinate (ordered list) vengono create utilizzando l'elemento `
              `. Ogni elemento al loro interno viene sempre creato con un elemento list item `
            1. `. Però ogni elemento di una lista ordinata inizia con un numero: @@ -25,7 +25,7 @@ Ordered lists are created using the `
                ` element. Each individual item in them ## --text-- -What HTML tag is used to create an ordered list? +Che tag HTML viene utilizzato per creare una lista ordinata? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/understand-ordered-and-unordered-list-question-c.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/understand-ordered-and-unordered-list-question-c.md index 1edd6feffbf..e9e0bc6cad4 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/understand-ordered-and-unordered-list-question-c.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/understand-ordered-and-unordered-list-question-c.md @@ -1,23 +1,23 @@ --- id: 637f4e5172c65bc8e73dfe26 -title: Understand Ordered and Unordered List Question C +title: Capire le Liste Ordinate e Non Ordinate Domanda C challengeType: 15 dashedName: understand-ordered-and-unordered-list-question-c --- # --description-- -If you want to have a list of items where the order doesn’t matter, like a shopping list of items that can be bought in any order, then you can use an unordered list. +Se vuoi creare una lista di elementi in cui l'ordine non conta, come una lista della spesa in cui gli elementi possono essere comprati in qualsiasi ordine, allora puoi usare una lista non ordinata. -Unordered lists are created using the `
                  ` element, and each item within the list is created using the list item element `
                • `. +Le liste non ordinate (unordered list) vengono create usando l'elemento `
                    ` e ogni elemento della lista viene creato usando l'elemento list item `
                  • `. -Each list item in an unordered list begins with a bullet point: +Ogni elemento della lista in una lista non ordinata inizia con un punto di elenco: -If you instead want to create a list of items where the order does matter, like step-by-step instructions for a recipe, or your top 10 favorite TV shows, then you can use an ordered list. +Se invece vuoi creare una lista di elementi in cui l'ordine conta, come delle istruzioni passo passo per una ricetta o la top 10 dei tuoi show televisivi preferiti, allora puoi usare una lista ordinata. -Ordered lists are created using the `
                      ` element. Each individual item in them is again created using the list item element `
                    1. `. However, each list item in an ordered list begins with a number instead: +Le liste ordinate (ordered list) vengono create utilizzando l'elemento `
                        `. Ogni elemento al loro interno viene sempre creato con un elemento list item `
                      1. `. Però ogni elemento di una lista ordinata inizia con un numero: @@ -25,7 +25,7 @@ Ordered lists are created using the `
                          ` element. Each individual item in them ## --text-- -What HTML tag is used to create list items within both unordered and ordered lists? +Quale tag HTML viene utilizzato per creare elementi di lista sia in liste non ordinata che in liste ordinate? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-a.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-a.md index 8698b62aca8..936ce11738b 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-a.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-a.md @@ -1,14 +1,14 @@ --- id: 637f4e5872c65bc8e73dfe27 videoId: yqcd-XkxZNM -title: Working With Text Question A +title: Lavorare con il Testo Domanda A challengeType: 15 dashedName: working-with-text-question-a --- # --description-- -What would you expect the following text to output on an HTML page? +Cosa ti aspetteresti che il seguente testo dia come output in una pagina HTML? ```html @@ -20,15 +20,15 @@ What would you expect the following text to output on an HTML page? ``` -It looks like two paragraphs of text, and so you might expect it to display in that way. However that is not the case, as you can see in the output below: +Sembrano due paragrafi di testo, quindi potresti aspettarti che appariranno in questo modo. Tuttavia non è così, come si può vedere nell'output qui sotto: -When the browser encounters new lines like this in your HTML, it will compress them down into one single space. The result of this compression is that all of the text is clumped together into one long line. +Quando il browser incontra nuove righe come quella nel tuo HTML, le comprime in un unico spazio. Il risultato di questa compressione è che tutto il testo viene ammassato insieme in una sola lunga riga. -If you want to create paragraphs in HTML, you need to use the paragraph element, which will add a newline after each of your paragraphs. A paragraph element is defined by wrapping text content with a `

                          ` tag. +Se vuoi creare dei paragrafi in HTML, devi utilizzare l'elemento paragrafo, che aggiungerà una nuova riga dopo ciascuno dei paragrafi. A paragraph element is defined by wrapping text content with a `

                          ` tag. -Changing our example from before to use paragraph elements fixes the issue: +Cambiando l'esempio precedente in modo da utilizzare elementi di paragrafo si risolve il problema: @@ -40,7 +40,7 @@ Watch and follow along to Kevin Powell’s HTML Paragraph and Headings Video abo ## --text-- -How do you create a paragraph in HTML? +Come si crea un paragrafo in HTML? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-b.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-b.md index 17d3c900359..9c0f51ccd7f 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-b.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-b.md @@ -1,38 +1,38 @@ --- id: 637f4e5f72c65bc8e73dfe28 -title: Working With Text Question B +title: Lavorare con il Testo Domanda B challengeType: 15 dashedName: working-with-text-question-b --- # --description-- -Headings are different from other HTML text elements: they are displayed larger and bolder than other text to signify that they are headings. +Le intestazioni sono diverse dagli altri elementi di testo HTML: vengono visualizzate più grandi e più in grassetto rispetto al resto del testo per mostrare che sono intestazioni. -There are 6 different levels of headings starting from `

                          ` to `

                          `. The number within a heading tag represents that heading’s level. The largest and most important heading is `h1`, while `h6` is the tiniest heading at the lowest level. +Esistono 6 diversi livelli di intestazioni partendo da `

                          ` fino a `

                          `. Il numero all'interno del tag di intestazione rappresenta il suo livello. L'intestazione più grande e più importante è `h1`, mentre `h6` è la più piccola, corrispondente al livello più basso. -Headings are defined much like paragraphs. For example, to create an `h1` heading, we wrap our heading text in a `

                          ` tag. +Le intestazioni sono definite come paragrafi. For example, to create an `h1` heading, we wrap our heading text in a `

                          ` tag. -Using the correct level of heading is important as levels provide a hierarchy to the content. An `h1` heading should always be used for the heading of the overall page, and the lower level headings should be used as the headings for content in smaller sections of the page. +Usare il giusto livello di intestazione è importante, in quanto i livelli forniscono una gerarchia al contenuto. Un'intestazione `h1` dovrebbe sempre essere utilizzata per l'intestazione generale della pagina, e quelle di livello inferiore devono essere utilizzate come intestazioni per il contenuto in sezioni più piccole della pagina. # --question-- ## --text-- -How many different levels of headings are there and what is the difference between them? +Quanti livelli di intestazione ci sono e qual è la differenza tra loro? ## --answers-- -There are 5 different levels of headings. `h5` is the smallest and least important heading, and `h1` is the largest and most important heading. +Esistono 5 diversi livelli di intestazione. `h5` è l'intestazione più piccola e meno importante, mentre `h1` è la più grande e la più importante. --- -There are 6 different levels of headings. `h6` is the largest and most important heading, and `h1` is the smallest and least important heading. +Esistono 6 diversi livelli di intestazione. `h6` è l'intestazione più grande e più importante, mentre `h1` è la più piccola e la meno importante. --- -There are 6 different levels of headings. `h1` is the largest and most important heading, and `h6` is the smallest and least important heading. +Esistono 6 diversi livelli di intestazione. `h1` è l'intestazione più grande e più importante, mentre `h6` è la più piccola e la meno importante. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-c.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-c.md index 6ccf0e06658..221a1ecc05c 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-c.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-c.md @@ -1,24 +1,24 @@ --- id: 637f4e6672c65bc8e73dfe29 videoId: gW6cBZLUk6M -title: Working With Text Question C +title: Lavorare con il Testo Domanda C challengeType: 15 dashedName: working-with-text-question-c --- # --description-- -The `` element makes text bold. It also semantically marks text as important; this affects tools, like screen readers, that users with visual impairments will rely on to use your website. The tone of voice on some screen readers will change to communicate the importance of the text within a `strong` element. To define a `strong` element you wrap text content in a `` tag. +L'elemento `` fa sì che il testo sia in grassetto. Contrassegna il testo come importante anche semanticamente; ciò influisce su strumenti, come i lettori di schermo, su cui gli utenti ipovedenti fanno affidamento per utilizzare un sito web. In alcuni lettori di schermo il tono della voce cambierà per comunicare l'importanza del testo all'interno di un elemento `strong`. To define a `strong` element you wrap text content in a `` tag. -You can use `strong` on its own: +Puoi usare `strong` da solo: -But you will probably find yourself using the `strong` element much more in combination with other text elements, like this: +Ma probabilmente ti ritroverai a usare l'elemento `strong` molto più spesso in combinazione con altri elementi di testo, come questo: -Sometimes you will want to make text bold without giving it an important meaning. You’ll learn how to do that in the CSS lessons later in the curriculum. +A volte si vuole rendere il testo in grassetto senza dargli un significato importante. Imparerai come farlo nelle lezioni CSS più avanti nel curriculum. # --question-- @@ -28,7 +28,7 @@ Watch Kevin Powell’s HTML Bold and Italic Text Video above. ## --text-- -What element should you use to make text bold and important? +Quale elemento dovresti usare per rendere il testo in grassetto e dargli importanza? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-d.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-d.md index e686b2698e0..82fb3fb034c 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-d.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-d.md @@ -1,25 +1,25 @@ --- id: 637f4e6e72c65bc8e73dfe2a -title: Working With Text Question D +title: Lavorare con il Testo Domanda D challengeType: 15 dashedName: working-with-text-question-d --- # --description-- -The `em` element makes text italic. It also semantically places emphasis on the text, which again may affect things like screen readers. To define an emphasized element you wrap text content in a `` tag. +L'elemento `em` fa sì che il testo sia in corsivo. Dà enfasi al testo anche semanticamente, influenzando anche in questo caso cose come i lettori di schermo. To define an emphasized element you wrap text content in a `` tag. -To use `em` on its own: +Puoi usare `em` da solo: -Again, like the `strong` element, you will find yourself mostly using the `em` element with other text elements: +Ancora una volta, come l'elemento `strong`, ti troverai per lo più a usare l'elemento `em` con altri elementi di testo: # --question-- ## --text-- -What element should you use to make text italicized to add emphasis? +Quale elemento dovresti usare per dare enfasi a del testo rendendolo in corsivo? ## --answers-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-e.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-e.md index a0a7ba2fda9..41e9dc6199b 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-e.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-e.md @@ -1,17 +1,17 @@ --- id: 637f4e7972c65bc8e73dfe2b -title: Working With Text Question E +title: Lavorare con il Testo Domanda E challengeType: 15 dashedName: working-with-text-question-e --- # --description-- -You may have noticed that in all the examples in this lesson you indent any elements that are within other elements. This is known as nesting elements. +Potresti aver notato che in tutti gli esempi di questa lezione gli elementi che si trovano all'interno di altri elementi sono indentati. Ciò viene detto annidare gli elementi. -When you nest elements within other elements, you create a parent and child relationship between them. The nested elements are the children and the element they are nested within is the parent. +Quando si annidano elementi all'interno di altri elementi, si crea una relazione genitore-figlio tra loro. Gli elementi annidati sono i figli e l'elemento dentro al quale sono annidati è il genitore. -In the following example, the `body` element is the parent and the `p` is the child: +Nell'esempio seguente, l'elemento `body` è il genitore e `p` è il figlio: ```html @@ -23,9 +23,9 @@ In the following example, the `body` element is the parent and the `p` is the ch ``` -Just as in human relationships, HTML parent elements can have many children. Elements at the same level of nesting are considered to be siblings. +Proprio come nelle relazioni umane, gli elementi HTML genitori possono avere molti figli. Gli elementi allo stesso livello di annidamento sono considerati fratelli. -For example, the two `p` elements in the following code are siblings, since they are both children of the `body` tag and are at the same level of nesting as each other: +Ad esempio, i due elementi `p` nel seguente codice sono fratelli, poiché sono entrambi figli del tag `body` e tra loro sono allo stesso livello di annidamento: ```html @@ -38,19 +38,19 @@ For example, the two `p` elements in the following code are siblings, since they ``` -You use indentation to make the level of nesting clear and readable for yourselves and other developers who will work with your HTML in the future. It is recommended to indent any child elements by two spaces. +L'indentazione si utilizza per rendere il livello di annidamento chiaro e leggibile a te stesso come ad altri sviluppatori che lavoreranno con il tuo HTML in futuro. Si raccomanda di indentare ogni elemento figlio di due spazi. -The parent, child, and sibling relationships between elements will become much more important later when you start styling your HTML with CSS and adding behavior with JavaScript. For now, however, it is just important to know the distinction between how elements are related and the terminology used to describe their relationships. +Il genitore, il figlio e le relazioni di fratellanza tra gli elementi diventeranno molto più importanti in seguito quando inizierai a definire lo stile del tuo HTML con CSS e ad aggiungere un comportamento con JavaScript. Per ora, tuttavia, è importante conoscere soltanto la distinzione tra come sono correlati gli elementi e la terminologia utilizzata per descrivere le loro relazioni. # --question-- ## --text-- -What relationship do two elements have if they are at the same level of nesting? +Quale relazione hanno due elementi se sono allo stesso livello di annidamento? ## --answers-- -The elements are each other's parents. +Gli elementi sono reciprocamente genitori. --- @@ -58,7 +58,7 @@ The elements are each other's children. --- -The elements are siblings. +Gli elementi sono fratelli. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-f.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-f.md index 7d440cfab25..6e9e3caf1a6 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-f.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-f.md @@ -1,17 +1,17 @@ --- id: 637f4e8072c65bc8e73dfe2c -title: Working With Text Question F +title: Lavorare con il Testo Domanda F challengeType: 15 dashedName: working-with-text-question-f --- # --description-- -You may have noticed that in all the examples in this lesson you indent any elements that are within other elements. This is known as nesting elements. +Potresti aver notato che in tutti gli esempi di questa lezione gli elementi che si trovano all'interno di altri elementi sono indentati. Ciò viene detto annidare gli elementi. -When you nest elements within other elements, you create a parent and child relationship between them. The nested elements are the children and the element they are nested within is the parent. +Quando si annidano elementi all'interno di altri elementi, tra loro si crea una relazione genitore-figlio. Gli elementi annidati sono i figli e l'elemento dentro al quale sono annidati è il genitore. -In the following example, the body element is the parent and the paragraph is the child: +Nell'esempio seguente, l'elemento body è il genitore e paragrafo è il figlio: ```html @@ -23,9 +23,9 @@ In the following example, the body element is the parent and the paragraph is th ``` -Just as in human relationships, HTML parent elements can have many children. Elements at the same level of nesting are considered to be siblings. +Proprio come nelle relazioni umane, gli elementi HTML genitori possono avere molti figli. Gli elementi allo stesso livello di annidamento sono considerati fratelli. -For example, the two paragraphs in the following code are siblings, since they are both children of the body tag and are at the same level of nesting as each other: +Ad esempio, i due paragrafi nel seguente codice sono fratelli, poiché sono entrambi figli del tag body e tra loro sono allo stesso livello di annidamento: ```html @@ -38,27 +38,27 @@ For example, the two paragraphs in the following code are siblings, since they a ``` -You use indentation to make the level of nesting clear and readable for yourselves and other developers who will work with your HTML in the future. It is recommended to indent any child elements by two spaces. +L'indentazione si utilizza per rendere il livello di annidamento chiaro e leggibile a te stesso come ad altri sviluppatori che lavoreranno con il tuo HTML in futuro. Si raccomanda di indentare ogni elemento figlio di due spazi. -The parent, child, and sibling relationships between elements will become much more important later when you start styling your HTML with CSS and adding behavior with JavaScript. For now, however, it is just important to know the distinction between how elements are related and the terminology used to describe their relationships. +Il genitore, il figlio e le relazioni di fratellanza tra gli elementi diventeranno molto più importanti in seguito quando inizierai a definire lo stile del tuo HTML con CSS e ad aggiungere un comportamento con JavaScript. Per ora, tuttavia, è importante conoscere soltanto la distinzione tra come sono correlati gli elementi e la terminologia utilizzata per descrivere le loro relazioni. # --question-- ## --text-- -What relationship does an element have with any nested element within it? +Che relazione hanno un elemento e un elemento annidato al suo interno? ## --answers-- -The element within the other element is called the parent element. +L'elemento all'interno dell'altro elemento è chiamato elemento genitore. --- -The element within the other element is called the child element. +L'elemento all'interno dell'altro elemento è chiamato elemento figlio. --- -The element within the other element is called the sibling element. +L'elemento all'interno dell'altro elemento è chiamato elemento fratello. ## --video-solution-- diff --git a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-g.md b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-g.md index 5f5d141fa46..0c2be4e19cb 100644 --- a/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-g.md +++ b/curriculum/challenges/italian/16-the-odin-project/top-learn-html-foundations/working-with-text-question-g.md @@ -1,15 +1,15 @@ --- id: 637f4e8772c65bc8e73dfe2d -title: Working With Text Question G +title: Lavorare con il Testo Domanda G challengeType: 15 dashedName: working-with-text-question-g --- # --description-- -HTML comments are not visible to the browser; they allow us to comment on your code so that other developers or your future selves can read them and get some context about something that might not be clear in the code. +I commenti HTML non sono visibili al browser; ci permettono di commentare il codice in modo che altri sviluppatori o il futuro te possano leggerli e avere del contesto su qualcosa che potrebbe non essere chiaro nel codice. -Writing an HTML comment is simple: You just enclose the comment with ``tags. For example: +Scrivere un commento HTML è semplice: racchiudi semplicemente il commento tra i tag ``. Ad esempio: ```html

                          View the html to see the hidden comments

                          @@ -25,11 +25,11 @@ Writing an HTML comment is simple: You just enclose the comment with `