chore(i8n,curriculum): processed translations (#41548)
Co-authored-by: Crowdin Bot <support+bot@crowdin.com>
This commit is contained in:
camperbot
GitHub
@ -29,11 +29,13 @@ CSS 边框具有 `style`、`color`、`width` 属性。
|
||||
|
||||
记得在一个元素上可以同时应用多个 `class`，使用空格来分隔不同 class 即可， 例如：
|
||||
|
||||
`<img class="class1 class2">`
|
||||
```html
|
||||
<img class="class1 class2">
|
||||
```
|
||||
|
||||
# --hints--
|
||||
|
||||
`img` 元素应包含 `smaller-image` class。
|
||||
`img` 元素的 class 应包含 `smaller-image`。
|
||||
|
||||
```js
|
||||
assert($('img').hasClass('smaller-image'));
|
||||
|
||||
@ -17,7 +17,9 @@ dashedName: change-the-color-of-text
|
||||
|
||||
以下是将 `h2` 元素设置为蓝色的方法：
|
||||
|
||||
`<h2 style="color: blue;">CatPhotoApp</h2>`
|
||||
```html
|
||||
<h2 style="color: blue;">CatPhotoApp</h2>
|
||||
```
|
||||
|
||||
请注意，需要在内联 `style` 声明末尾加上 `;`。
|
||||
|
||||
|
||||
@ -17,10 +17,15 @@ dashedName: import-a-google-font
|
||||
|
||||
要引入 Google Font，你需要从 Google Fonts 上复制字体的 URL，并粘贴到你的 HTML 里面。 在这个挑战中，我们需要引入 `Lobster` 字体。 因此，请复制以下代码段，并粘贴到代码编辑器顶部，即放到 `style` 标签之前。
|
||||
|
||||
`<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">`
|
||||
```html
|
||||
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
|
||||
```
|
||||
|
||||
现在你可以通过将下面例子中的 FAMILY_NAMEFAMILY_NAME 替换为 `Lobster`，来使用 `Lobster` 字体：
|
||||
`font-family: FAMILY_NAME, GENERIC_NAME;`。
|
||||
现在可以在 CSS 中使用 `Lobster` 字体，并像下面一样使用 `Lobster` 作为 FAMILY_NAME：
|
||||
|
||||
```css
|
||||
font-family: FAMILY_NAME, GENERIC_NAME;
|
||||
```
|
||||
|
||||
GENERIC_NAME 是可选的，它用来指明在其他字体不可用时的后备字体。 我们会在下一个挑战中详细说明。
|
||||
|
||||
@ -28,7 +33,7 @@ GENERIC_NAME 是可选的，它用来指明在其他字体不可用时的后备
|
||||
|
||||
# --instructions--
|
||||
|
||||
给你的网页导入 `Lobster` 字体。 引入 Lobster 字体，然后使用元素选择器将 `h2` 元素的 `font-family` 设置为 `Lobster`。
|
||||
给你的网页导入 `Lobster` 字体。 然后使用元素选择器将 `h2` 元素的 `font-family` 设置为 `Lobster`。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@ -23,17 +23,19 @@ dashedName: override-all-other-styles-by-using-important
|
||||
|
||||
如下所示：
|
||||
|
||||
`color: red !important;`
|
||||
```css
|
||||
color: red !important;
|
||||
```
|
||||
|
||||
# --hints--
|
||||
|
||||
`h1` 元素的应有一个 class 为 `pink-text`。
|
||||
`h1` 元素应包含 `pink-text` class。
|
||||
|
||||
```js
|
||||
assert($('h1').hasClass('pink-text'));
|
||||
```
|
||||
|
||||
`h1` 元素应该包含 `color: white` 的行内样式声明。
|
||||
`h1` 元素应包含 `blue-text` class。
|
||||
|
||||
```js
|
||||
assert($('h1').hasClass('blue-text'));
|
||||
@ -51,7 +53,7 @@ assert($('h1').attr('id') === 'orange-text');
|
||||
assert(code.match(/<h1.*style/gi) && code.match(/<h1.*style.*color\s*?:/gi));
|
||||
```
|
||||
|
||||
`pink-text` 类应有 `!important` 关键词 ，以覆盖其他声明。
|
||||
`pink-text` class 应有 `!important` 关键词 ，以覆盖其他声明。
|
||||
|
||||
```js
|
||||
assert(
|
||||
|
||||
@ -19,9 +19,11 @@ dashedName: override-class-declarations-by-styling-id-attributes
|
||||
|
||||
给 `h1` 元素添加 `id` 属性，属性值为 `orange-text`。 设置方式如下：
|
||||
|
||||
`<h1 id="orange-text">`
|
||||
```html
|
||||
<h1 id="orange-text">
|
||||
```
|
||||
|
||||
`h1` 元素应继续保留 `blue-text` 和 `pink-text` 这两个 class。
|
||||
`h1` 元素需继续保留 `blue-text` 和 `pink-text` 这两个 class。
|
||||
|
||||
在 `style` 元素中创建名为 `orange-text` 的 id 选择器。 例子如下：
|
||||
|
||||
@ -35,7 +37,7 @@ dashedName: override-class-declarations-by-styling-id-attributes
|
||||
|
||||
# --hints--
|
||||
|
||||
`h1` 元素应包含 `pink-text` class。
|
||||
`h1` 元素的应有一个 class 为 `pink-text`。
|
||||
|
||||
```js
|
||||
assert($('h1').hasClass('pink-text'));
|
||||
@ -47,7 +49,7 @@ assert($('h1').hasClass('pink-text'));
|
||||
assert($('h1').hasClass('blue-text'));
|
||||
```
|
||||
|
||||
`h1` 的 id 属性值应为 `orange-text`。
|
||||
`h1` 元素的 id 应为 `orange-text`。
|
||||
|
||||
```js
|
||||
assert($('h1').attr('id') === 'orange-text');
|
||||
|
||||
@ -17,9 +17,11 @@ dashedName: override-class-declarations-with-inline-styles
|
||||
|
||||
使用行内样式尝试让 `h1` 的字体颜色变白。 像这样使用：
|
||||
|
||||
`<h1 style="color: green;">`
|
||||
```html
|
||||
<h1 style="color: green;">
|
||||
```
|
||||
|
||||
`h1` 元素需继续保留 `blue-text` 和 `pink-text` 这两个 class。
|
||||
`h1` 元素应继续保留 `blue-text` 和 `pink-text` 这两个 class。
|
||||
|
||||
# --hints--
|
||||
|
||||
@ -35,7 +37,7 @@ assert($('h1').hasClass('pink-text'));
|
||||
assert($('h1').hasClass('blue-text'));
|
||||
```
|
||||
|
||||
`h1` 元素的 id 应为 `orange-text`。
|
||||
`h1` 的 id 属性值应为 `orange-text`。
|
||||
|
||||
```js
|
||||
assert($('h1').attr('id') === 'orange-text');
|
||||
|
||||
@ -21,7 +21,9 @@ dashedName: override-styles-in-subsequent-css
|
||||
|
||||
HTML 同时应用多个 class 属性需以空格来间隔，例子如下:
|
||||
|
||||
`class="class1 class2"`
|
||||
```html
|
||||
class="class1 class2"
|
||||
```
|
||||
|
||||
**注意：**HTML 元素里应用的 class 的先后顺序无关紧要。
|
||||
|
||||
|
||||
@ -17,11 +17,13 @@ dashedName: set-the-id-of-an-element
|
||||
|
||||
设置 `h2` 元素的 id 为 `cat-photo-app` 的代码如下：
|
||||
|
||||
`<h2 id="cat-photo-app">`
|
||||
```html
|
||||
<h2 id="cat-photo-app">
|
||||
```
|
||||
|
||||
# --instructions--
|
||||
|
||||
请将 `form` 元素的 id 设置为 `cat-photo-form`。
|
||||
设置`form`元素的 id 为`cat-photo-form`。
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@ -13,7 +13,9 @@ dashedName: use-clockwise-notation-to-specify-the-margin-of-an-element
|
||||
|
||||
同样，每个方向的外边距值可以在一行里面汇总声明，而无需分别通过 `margin-top`、`margin-right`、`margin-bottom`、`margin-left` 分别声明，比如：
|
||||
|
||||
`margin: 10px 20px 10px 20px;`
|
||||
```css
|
||||
margin: 10px 20px 10px 20px;
|
||||
```
|
||||
|
||||
这四个值按顺时针排序：上、右、下、左，并且设置的效果等同于分别声明每一个方向的外边距值。
|
||||
|
||||
|
||||
@ -11,7 +11,9 @@ dashedName: use-clockwise-notation-to-specify-the-padding-of-an-element
|
||||
|
||||
如果不想每次都要分别声明 `padding-top`、`padding-right`、`padding-bottom`、`padding-left` 属性，可以把它们汇总在一行里面一并声明，像是这样：
|
||||
|
||||
`padding: 10px 20px 10px 20px;`
|
||||
```css
|
||||
padding: 10px 20px 10px 20px;
|
||||
```
|
||||
|
||||
这四个值按顺时针排序：上、右、下、左，并且设置的效果等同于分别声明每一个方向的内边距。
|
||||
|
||||
|
||||
@ -13,11 +13,15 @@ dashedName: use-rgb-values-to-color-elements
|
||||
|
||||
黑色的 `RGB` 值：
|
||||
|
||||
`rgb(0, 0, 0)`
|
||||
```css
|
||||
rgb(0, 0, 0)
|
||||
```
|
||||
|
||||
白色的 `RGB` 值：
|
||||
|
||||
`rgb(255, 255, 255)`
|
||||
```css
|
||||
rgb(255, 255, 255)
|
||||
```
|
||||
|
||||
RGB 值与我们之前学到的十六进制编码不同。`RGB` 值不需要用到 6 位十六进制数字，而只需要指定每种颜色的亮度大小，数值范围从 0 到 255。
|
||||
|
||||
|
||||
Reference in New Issue
Block a user