diff --git a/curriculum/challenges/spanish/03-front-end-libraries/sass/nest-css-with-sass.spanish.md b/curriculum/challenges/spanish/03-front-end-libraries/sass/nest-css-with-sass.spanish.md index a40fe5445e..9e83c204ac 100644 --- a/curriculum/challenges/spanish/03-front-end-libraries/sass/nest-css-with-sass.spanish.md +++ b/curriculum/challenges/spanish/03-front-end-libraries/sass/nest-css-with-sass.spanish.md @@ -10,7 +10,37 @@ localeTitle: Nest CSS con Sass --- ## Description -
Sass permite nesting reglas CSS, que es una forma útil de organizar una hoja de estilo. Normalmente, cada elemento está enfocado en una línea diferente para diseñarlo, así:
nav {
color de fondo: rojo;
}

nav ul {
estilo de lista: ninguno;
}

nav ul li {
pantalla: bloque en línea;
}
Para un proyecto grande, el archivo CSS tendrá muchas líneas y reglas. Aquí es donde el nesting puede ayudar a organizar su código al colocar reglas de estilo secundarias dentro de los elementos principales respectivos:
nav {
color de fondo: rojo;

ul {
estilo de lista: ninguno;

li {
pantalla: bloque en línea;
}
}
}
+
+Sass permite anidamiento (nesting) de reglas CSS, que es una forma útil de organizar una hoja de estilo. Normalmente, cada elemento se escribe en una línea diferente para darle estilo así: + +```html +nav { + background-color: red; +} + +nav ul { + list-style: none; +} + +nav ul li { + display: inline-block; +} +``` + +Para un proyecto grande, el archivo CSS tendrá muchas líneas y reglas. Aquí es donde el nesting puede ayudar a organizar su código al colocar reglas de estilo secundarias dentro de los respectivos elementos principales: + +```html +nav { + background-color: red; + ul { + list-style: none; + li { + display: inline-block; + } + } +} +``` +
## Instructions
Use la técnica de nesting que se muestra arriba para reorganizar las reglas de CSS para ambos elementos del elemento .blog-post . Para propósitos de prueba, el h1 debe venir antes del elemento p .