chore(i18n,curriculum): update translations (#42568)
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 5a24c314108439a4d4036182
|
||||
title: Add Inline Styles in React
|
||||
title: Agrega estilos en línea en React
|
||||
challengeType: 6
|
||||
forumTopicId: 301378
|
||||
dashedName: add-inline-styles-in-react
|
||||
@@ -8,41 +8,41 @@ dashedName: add-inline-styles-in-react
|
||||
|
||||
# --description--
|
||||
|
||||
You may have noticed in the last challenge that there were several other syntax differences from HTML inline styles in addition to the `style` attribute set to a JavaScript object. First, the names of certain CSS style properties use camel case. For example, the last challenge set the size of the font with `fontSize` instead of `font-size`. Hyphenated words like `font-size` are invalid syntax for JavaScript object properties, so React uses camel case. As a rule, any hyphenated style properties are written using camel case in JSX.
|
||||
Es posible que hayas notado en el último desafío que había otras diferencias de sintaxis con respecto a los estilos en línea de HTML, además del atributo `style` establecido en un objeto de JavaScript. En primer lugar, los nombres de ciertas propiedades de estilo CSS utilizan camel case. Por ejemplo, el último desafío establece el tamaño de la fuente con `fontSize` en lugar de `font-size`. Palabras que incluyen guion como `font-size` son sintaxis inválidas para propiedades de objetos de JavaScript, por lo que React utiliza camel case. Como regla, cualquier propiedad de estilo que usa guion se escribe usando camel case en JSX.
|
||||
|
||||
All property value length units (like `height`, `width`, and `fontSize`) are assumed to be in `px` unless otherwise specified. If you want to use `em`, for example, you wrap the value and the units in quotes, like `{fontSize: "4em"}`. Other than the length values that default to `px`, all other property values should be wrapped in quotes.
|
||||
Todas las unidades de longitud del valor de la propiedad (como `height`, `width`, y `fontSize`) se supone que están en `px` a menos que se especifique lo contrario. Si quieres utilizar `em`, por ejemplo, debes envolver el valor y las unidades entre comillas, como `{fontSize: "4em"}`. Aparte de los valores de longitud que por defecto son `px`, todos los demás valores de las propiedades deben estar envueltos entre comillas.
|
||||
|
||||
# --instructions--
|
||||
|
||||
If you have a large set of styles, you can assign a style `object` to a constant to keep your code organized. Initialize a `styles` constant and assign an `object` with three style properties and their values to it. Give the `div` a color of `"purple"`, a font-size of `40`, and a border of `"2px solid purple"`. Then set the `style` attribute equal to the `styles` constant.
|
||||
Si tienes una gran cantidad de estilos, puedes asignar un `object` de estilos a una constante para mantener tu código organizado. Declara tu constante "styles" como una variable global al principio del archivo. Inicializa la constante `styles` y asígnale un `object` con tres propiedades de estilo y sus valores. Dale al `div` un color `purple`, un tamaño de fuente de `40` y un borde `2px solid purple`. Luego asigna al atributo `style` la constante `styles`.
|
||||
|
||||
# --hints--
|
||||
|
||||
The `styles` variable should be an `object` with three properties.
|
||||
La variable `styles` debe ser un `object` con tres propiedades.
|
||||
|
||||
```js
|
||||
assert(Object.keys(styles).length === 3);
|
||||
```
|
||||
|
||||
The `styles` variable should have a `color` property set to a value of `purple`.
|
||||
La variable `styles` debe contener una propiedad `color` con el valor de `purple`.
|
||||
|
||||
```js
|
||||
assert(styles.color === 'purple');
|
||||
```
|
||||
|
||||
The `styles` variable should have a `fontSize` property set to a value of `40`.
|
||||
La variable `styles` debe contener una propiedad `fontSize` con el valor de `40`.
|
||||
|
||||
```js
|
||||
assert(styles.fontSize === 40);
|
||||
```
|
||||
|
||||
The `styles` variable should have a `border` property set to a value of `2px solid purple`.
|
||||
La variable `styles` debe contener una propiedad `border` con el valor de `2px solid purple`.
|
||||
|
||||
```js
|
||||
assert(styles.border === '2px solid purple');
|
||||
```
|
||||
|
||||
The component should render a `div` element.
|
||||
El componente debe renderizar un elemento `div`.
|
||||
|
||||
```js
|
||||
assert(
|
||||
@@ -53,7 +53,7 @@ assert(
|
||||
);
|
||||
```
|
||||
|
||||
The `div` element should have its styles defined by the `styles` object.
|
||||
El elemento `div` debe tener sus estilos definidos en el objeto `styles`.
|
||||
|
||||
```js
|
||||
assert(
|
||||
|
Reference in New Issue
Block a user