From c31d1e2de9fee430e0429e3a1ac62baffb38d9e0 Mon Sep 17 00:00:00 2001 From: Nathan Lakritz Date: Wed, 13 Mar 2019 12:38:25 -0700 Subject: [PATCH] Add semicolon to inline CSS (#34737) --- .../basic-css/use-css-selectors-to-style-elements.arabic.md | 2 +- .../basic-css/use-css-selectors-to-style-elements.chinese.md | 4 ++-- .../basic-css/use-css-selectors-to-style-elements.english.md | 4 ++-- .../use-css-selectors-to-style-elements.portuguese.md | 4 ++-- .../basic-css/use-css-selectors-to-style-elements.russian.md | 5 +++-- .../basic-css/use-css-selectors-to-style-elements.spanish.md | 4 ++-- 6 files changed, 12 insertions(+), 11 deletions(-) diff --git a/curriculum/challenges/arabic/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.arabic.md b/curriculum/challenges/arabic/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.arabic.md index 482826e728..aada3a3200 100644 --- a/curriculum/challenges/arabic/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.arabic.md +++ b/curriculum/challenges/arabic/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.arabic.md @@ -38,7 +38,7 @@ tests:
```html -

CatPhotoApp

+

CatPhotoApp

Click here to view more cat photos.

diff --git a/curriculum/challenges/chinese/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.chinese.md b/curriculum/challenges/chinese/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.chinese.md index 04d09556d9..32963dd2b9 100644 --- a/curriculum/challenges/chinese/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.chinese.md +++ b/curriculum/challenges/chinese/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.chinese.md @@ -7,7 +7,7 @@ localeTitle: 使用CSS选择器设置样式元素 --- ## Description -
使用CSS,您可以使用数百种CSS properties来更改元素在页面上的显示方式。当您输入<h2 style="color: red">CatPhotoApp</h2> ,您使用inline CSS (代表Cascading Style Sheets对单个h2元素进行Cascading Style Sheets 。这是指定元素样式的一种方法,但有一种更好的方法来应用CSS 。在代码的顶部,创建一个style块,如下所示:
<风格>
</样式>
在该样式块中,您可以为所有h2元素创建CSS selector 。例如,如果您希望所有h2元素都是红色,则可以添加如下所示的样式规则:
<风格>
h2 {color:red;}
</样式>
请注意,在每个元素的样式规则周围同时打开和关闭花括号( {} )非常重要。您还需要确保元素的样式定义位于开始和结束样式标记之间。最后,请务必在每个元素的样式规则的末尾添加分号。
+
使用CSS,您可以使用数百种CSS properties来更改元素在页面上的显示方式。当您输入<h2 style="color: red;">CatPhotoApp</h2> ,您使用inline CSS (代表Cascading Style Sheets对单个h2元素进行Cascading Style Sheets 。这是指定元素样式的一种方法,但有一种更好的方法来应用CSS 。在代码的顶部,创建一个style块,如下所示:
<风格>
</样式>
在该样式块中,您可以为所有h2元素创建CSS selector 。例如,如果您希望所有h2元素都是红色,则可以添加如下所示的样式规则:
<风格>
h2 {color:red;}
</样式>
请注意,在每个元素的样式规则周围同时打开和关闭花括号( {} )非常重要。您还需要确保元素的样式定义位于开始和结束样式标记之间。最后,请务必在每个元素的样式规则的末尾添加分号。
## Instructions
删除h2元素的样式属性,而不是创建CSS style块。添加必要的CSS以将所有h2元素变为蓝色。
@@ -38,7 +38,7 @@ tests:
```html -

CatPhotoApp

+

CatPhotoApp

Click here to view more cat photos.

diff --git a/curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.english.md b/curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.english.md index 2347509369..725a7a61ef 100644 --- a/curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.english.md +++ b/curriculum/challenges/english/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.english.md @@ -8,7 +8,7 @@ videoUrl: 'https://scrimba.com/c/cJKMBT2' ## Description
With CSS, there are hundreds of CSS properties that you can use to change the way an element looks on your page. -When you entered <h2 style="color: red">CatPhotoApp</h2>, you were styling that individual h2 element with inline CSS, which stands for Cascading Style Sheets. +When you entered <h2 style="color: red;">CatPhotoApp</h2>, you were styling that individual h2 element with inline CSS, which stands for Cascading Style Sheets. That's one way to specify the style of an element, but there's a better way to apply CSS. At the top of your code, create a style block like this:
<style>
</style>
@@ -48,7 +48,7 @@ tests:
```html -

CatPhotoApp

+

CatPhotoApp

Click here to view more cat photos.

diff --git a/curriculum/challenges/portuguese/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.portuguese.md b/curriculum/challenges/portuguese/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.portuguese.md index 38ef8e081f..d1c9341898 100644 --- a/curriculum/challenges/portuguese/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.portuguese.md +++ b/curriculum/challenges/portuguese/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.portuguese.md @@ -7,7 +7,7 @@ localeTitle: Use seletores CSS para elementos de estilo --- ## Description -
Com o CSS, existem centenas de properties CSS que você pode usar para alterar a aparência de um elemento na sua página. Quando você digitou <h2 style="color: red">CatPhotoApp</h2> , você estava estilizando esse elemento h2 individual com inline CSS , que significa Cascading Style Sheets . Essa é uma maneira de especificar o estilo de um elemento, mas há uma maneira melhor de aplicar CSS . Na parte superior do seu código, crie um bloco de style como este:
<style>
</ style>
Dentro desse bloco de estilo, você pode criar um CSS selector para todos os elementos h2 . Por exemplo, se você quisesse que todos os elementos h2 fossem vermelhos, você adicionaria uma regra de estilo semelhante a esta:
<style>
h2 {cor: vermelho;}
</ style>
Observe que é importante ter chaves de abertura e de fechamento ( { e } ) ao redor das regras de estilo de cada elemento. Você também precisa garantir que a definição de estilo do seu elemento esteja entre as tags de estilo de abertura e fechamento. Por fim, adicione um ponto-e-vírgula ao final de cada uma das regras de estilo de seu elemento.
+
Com o CSS, existem centenas de properties CSS que você pode usar para alterar a aparência de um elemento na sua página. Quando você digitou <h2 style="color: red;">CatPhotoApp</h2> , você estava estilizando esse elemento h2 individual com inline CSS , que significa Cascading Style Sheets . Essa é uma maneira de especificar o estilo de um elemento, mas há uma maneira melhor de aplicar CSS . Na parte superior do seu código, crie um bloco de style como este:
<style>
</ style>
Dentro desse bloco de estilo, você pode criar um CSS selector para todos os elementos h2 . Por exemplo, se você quisesse que todos os elementos h2 fossem vermelhos, você adicionaria uma regra de estilo semelhante a esta:
<style>
h2 {cor: vermelho;}
</ style>
Observe que é importante ter chaves de abertura e de fechamento ( { e } ) ao redor das regras de estilo de cada elemento. Você também precisa garantir que a definição de estilo do seu elemento esteja entre as tags de estilo de abertura e fechamento. Por fim, adicione um ponto-e-vírgula ao final de cada uma das regras de estilo de seu elemento.
## Instructions
Exclua o atributo style do seu elemento h2 e, em vez disso, crie um bloco de style CSS. Adicione o CSS necessário para tornar todos os elementos h2 azuis.
@@ -38,7 +38,7 @@ tests:
```html -

CatPhotoApp

+

CatPhotoApp

Click here to view more cat photos.

diff --git a/curriculum/challenges/russian/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.russian.md b/curriculum/challenges/russian/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.russian.md index 8927258fa8..c4fd99be4c 100644 --- a/curriculum/challenges/russian/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.russian.md +++ b/curriculum/challenges/russian/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.russian.md @@ -7,7 +7,8 @@ localeTitle: Используйте селекторы CSS для изменен --- ## Description -
В CSS есть сотни properties CSS, которые вы можете использовать, чтобы изменить способ поиска элемента на вашей странице. Когда вы ввели <h2 style="color: red">CatPhotoApp</h2> , вы стали стилизовать этот отдельный элемент h2 со inline CSS , который обозначает Cascading Style Sheets . Это один из способов указать стиль элемента, но есть лучший способ применить CSS . В верхней части кода создайте блок style следующим образом:
<style>
</ style>
Внутри этого блока стиля вы можете создать CSS selector для всех элементов h2 . Например, если вы хотите, чтобы все элементы h2 были красными, вы можете добавить правило CSS, которое выглядит так:
<style>
h2 {color: red;}
</ style>
Обратите внимание, что важно иметь как открывающиеся, так и закрывающие фигурные скобки ( { и } ) вокруг правила CSS каждого селектора. Вы также должны убедиться, что правила CSS вашего селектора находится между открывающей и закрывающей фигурной скобкой. Наконец, обязательно добавьте точку с запятой в конец каждого из правил CSS вашего селектора.
+ +
В CSS есть сотни properties CSS, которые вы можете использовать, чтобы изменить способ поиска элемента на вашей странице. Когда вы ввели <h2 style="color: red;">CatPhotoApp</h2> , вы стали стилизовать этот отдельный элемент h2 со inline CSS , который обозначает Cascading Style Sheets . Это один из способов указать стиль элемента, но есть лучший способ применить CSS . В верхней части кода создайте блок style следующим образом:
<style>
</ style>
Внутри этого блока стиля вы можете создать CSS selector для всех элементов h2 . Например, если вы хотите, чтобы все элементы h2 были красными, вы можете добавить правило CSS, которое выглядит так:
<style>
h2 {color: red;}
</ style>
Обратите внимание, что важно иметь как открывающиеся, так и закрывающие фигурные скобки ( { и } ) вокруг правила CSS каждого селектора. Вы также должны убедиться, что правила CSS вашего селектора находится между открывающей и закрывающей фигурной скобкой. Наконец, обязательно добавьте точку с запятой в конец каждого из правил CSS вашего селектора.
## Instructions
Удалите атрибут стиля элемента h2 и вместо этого создайте блок style CSS. Добавьте необходимые правила CSS, чтобы все элементы h2 стали синими.
@@ -38,7 +39,7 @@ tests:
```html -

CatPhotoApp

+

CatPhotoApp

Click here to view more cat photos.

diff --git a/curriculum/challenges/spanish/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.spanish.md b/curriculum/challenges/spanish/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.spanish.md index 7774e74013..5aef41c771 100644 --- a/curriculum/challenges/spanish/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.spanish.md +++ b/curriculum/challenges/spanish/01-responsive-web-design/basic-css/use-css-selectors-to-style-elements.spanish.md @@ -7,7 +7,7 @@ localeTitle: Usar los selectores CSS para dar estilo a los elementos --- ## Descripción -
Con CSS, hay cientos de properties CSS que puedes usar para cambiar la apariencia de un elemento en tu página. Cuando ingresaste <h2 style="color: red">CatPhotoApp</h2> , estabas dando estilo a ese elemento h2 con inline CSS , que significa Cascading Style Sheets . Esa es una forma de especificar el estilo de un elemento, pero existe una mejor manera de aplicar CSS . En la parte superior de tu código, crea un bloque de style como este:
<style>
</style>
Dentro de ese bloque de estilo, puedes crear un CSS selector para todos los elementos h2 . Por ejemplo, si deseas que todos los elementos h2 sean rojos, debes agregar una regla de estilo como esta:
<style>
h2 {color: red;}
</style>
Ten en cuenta que es importante usar llaves de apertura y cierre ( { y } ) alrededor de las reglas de estilo de cada elemento. También debe asegurarse de que la definición de estilo de su elemento se encuentre entre las etiquetas de estilo de apertura y de cierre. Finalmente, asegúrese de agregar un punto y coma al final de cada una de las reglas de estilo de su elemento.
+
Con CSS, hay cientos de properties CSS que puedes usar para cambiar la apariencia de un elemento en tu página. Cuando ingresaste <h2 style="color: red;">CatPhotoApp</h2> , estabas dando estilo a ese elemento h2 con inline CSS , que significa Cascading Style Sheets . Esa es una forma de especificar el estilo de un elemento, pero existe una mejor manera de aplicar CSS . En la parte superior de tu código, crea un bloque de style como este:
<style>
</style>
Dentro de ese bloque de estilo, puedes crear un CSS selector para todos los elementos h2 . Por ejemplo, si deseas que todos los elementos h2 sean rojos, debes agregar una regla de estilo como esta:
<style>
h2 {color: red;}
</style>
Ten en cuenta que es importante usar llaves de apertura y cierre ( { y } ) alrededor de las reglas de estilo de cada elemento. También debe asegurarse de que la definición de estilo de su elemento se encuentre entre las etiquetas de estilo de apertura y de cierre. Finalmente, asegúrese de agregar un punto y coma al final de cada una de las reglas de estilo de su elemento.
## Instrucciones
Borra el atributo de estilo del elemento h2 y, en su lugar, crea un bloque de style CSS. Agrega el CSS necesario para dar a todos los elementos h2 color azul.
@@ -38,7 +38,7 @@ tests:
```html -

CatPhotoApp

+

CatPhotoApp

Haga clic aquí para ver más fotos de gatos.