Fixed the code formatting for readability (#25831)
I fixed the code formatting for readability. Made the spacing easier to see so updates and changes could be made more easily.pull/35414/head
Alex
Jaka Kranjc
parent
1c4d57dfb3
commit
06311a56f6
|
|
@ -8,7 +8,29 @@ localeTitle: Construir una página de tributo
|
|||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> <strong>Objetivo:</strong> crear una aplicación <a href="https://codepen.io" target="_blank">CodePen.io</a> que sea funcionalmente similar a esta: <a href="https://codepen.io/freeCodeCamp/full/zNqgVx" target="_blank">https://codepen.io/freeCodeCamp/full/zNqgVx</a> . Cumple las siguientes <a href="https://en.wikipedia.org/wiki/User_story" target="_blank">historias de usuario</a> y haz que pasen todas las pruebas. Dale tu propio estilo personal. Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda CSS simple porque eso es lo que las lecciones han cubierto hasta ahora y debe obtener algo de práctica con CSS simple. Puede utilizar Bootstrap o SASS si lo desea. No se recomiendan tecnologías adicionales (solo por ejemplo, jQuery, React, Angular o Vue) para este proyecto, y su uso es bajo su propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes pilas de tecnología como React. Aceptaremos e intentaremos solucionar todos los informes de problemas que utilizan la pila de tecnología sugerida para este proyecto. ¡Feliz codificación! <strong>Historia de usuario n. ° 1:</strong> Mi página de tributo debe tener un elemento con su correspondiente <code>id="main"</code> , que contiene todos los demás elementos. <strong>Historia de usuario n. ° 2:</strong> Debería ver un elemento con una <code>id="title"</code> correspondiente <code>id="title"</code> , que contiene una cadena (es decir, texto) que describe el tema de la página del tributo (por ejemplo, "Dr. Norman Borlaug"). <strong>Historia de usuario n. ° 3:</strong> Debería ver un elemento <code>div</code> con un <code>id="img-div"</code> correspondiente <code>id="img-div"</code> . <strong>Historia de usuario n. ° 4:</strong> Dentro del elemento <code>img-div</code> , debería ver un elemento <code>img</code> con una <code>id="image"</code> correspondiente <code>id="image"</code> . <strong>Historia de usuario n. ° 5:</strong> Dentro del elemento <code>img-div</code> , debería ver un elemento con una <code>id="img-caption"</code> correspondiente <code>id="img-caption"</code> que contiene contenido textual que describe la imagen que se muestra en <code>img-div</code> . <strong>Historia de usuario n. ° 6:</strong> Debería ver un elemento con un <code>id="tribute-info"</code> correspondiente <code>id="tribute-info"</code> , que contiene contenido textual que describe el tema de la página de tributo. <strong>Historia de usuario n. ° 7:</strong> Debería ver un elemento <code>a</code> con un correspondiente <code>id="tribute-link"</code> , que une a un sitio externo que contiene información adicional sobre el tema de la página de tributo. SUGERENCIA: debe asignar a su elemento un atributo de <code>target</code> y configurarlo en <code>_blank</code> para que su enlace se abra en una nueva pestaña (es decir, <code>target="_blank"</code> ). <strong>Historia de usuario n. ° 8:</strong> el elemento <code>img</code> debe redimensionarse responsivamente, en relación con el ancho de su elemento principal, sin exceder su tamaño original. <strong>Historia de usuario n. ° 9:</strong> el elemento <code>img</code> debe estar centrado dentro de su elemento primario. Puedes construir tu proyecto por medio de <a href="http://codepen.io/freeCodeCamp/pen/MJjpwO" target="_blank">este bolígrafo CodePen</a> . O puede usar este enlace CDN para ejecutar las pruebas en el entorno que desee: <code>https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js</code> . Una vez que haya terminado, envíe la URL a su proyecto de trabajo con todas las pruebas aprobadas. Recuerde usar el método de <a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/19514" target="_blank">lectura-búsqueda-pregunta</a> si se atasca. </section>
|
||||
<section id="description">
|
||||
<strong>Objetivo:</strong> crear una aplicación <a href="https://codepen.io" target="_blank">CodePen.io</a>
|
||||
Que sea funcionalmente similar a esta: <a href="https://codepen.io/freeCodeCamp/full/zNqgVx" target="_blank">https://codepen.io/freeCodeCamp/full/zNqgVx</a>.
|
||||
|
||||
Cumple las siguientes <a href="https://en.wikipedia.org/wiki/User_story" target="_blank">historias de usuario</a> y haz que pasen todas las pruebas. Dale tu propio estilo personal. Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda CSS simple porque eso es lo que las lecciones han cubierto hasta ahora y debe obtener algo de práctica con CSS simple. Puede utilizar Bootstrap o SASS si lo desea. No se recomiendan tecnologías adicionales (solo por ejemplo, jQuery, React, Angular o Vue) para este proyecto, y su uso es bajo su propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes pilas de tecnología como React. Aceptaremos e intentaremos solucionar todos los informes de problemas que utilizan la pila de tecnología sugerida para este proyecto. ¡Feliz codificación!
|
||||
|
||||
<strong>Historia de usuario no. 1:</strong> Mi página de tributo debe tener un elemento con su correspondiente <code>id="main"</code> , que contiene todos los demás elementos.
|
||||
|
||||
<strong>Historia de usuario no. 2:</strong> Debería ver un elemento con una <code>id="title"</code> correspondiente <code>id="title"</code> , que contiene una cadena (es decir, texto) que describe el tema de la página del tributo (por ejemplo, "Dr. Norman Borlaug").
|
||||
|
||||
<strong>Historia de usuario no. 3:</strong> Debería ver un elemento <code>div</code> con un <code>id="img-div"</code> correspondiente <code>id="img-div"</code>.
|
||||
|
||||
<strong>Historia de usuario no. 4:</strong> Dentro del elemento <code>img-div</code> , debería ver un elemento <code>img</code> con una <code>id="image"</code> correspondiente <code>id="image"</code>.
|
||||
|
||||
<strong>Historia de usuario no. 5:</strong> Dentro del elemento <code>img-div</code> , debería ver un elemento con una <code>id="img-caption"</code> correspondiente <code>id="img-caption"</code> que contiene contenido textual que describe la imagen que se muestra en <code>img-div</code>.
|
||||
|
||||
<strong>Historia de usuario no. 6:</strong> Debería ver un elemento con un <code>id="tribute-info"</code> correspondiente <code>id="tribute-info"</code> , que contiene contenido textual que describe el tema de la página de tributo.
|
||||
|
||||
<strong>Historia de usuario no. 7:</strong> Debería ver un elemento <code>a</code> con un correspondiente <code>id="tribute-link"</code> , que une a un sitio externo que contiene información adicional sobre el tema de la página de tributo. SUGERENCIA: debe asignar a su elemento un atributo de <code>target</code> y configurarlo en <code>_blank</code> para que su enlace se abra en una nueva pestaña (es decir, <code>target="_blank"</code> ).
|
||||
|
||||
<strong>Historia de usuario no. 8:</strong> el elemento <code>img</code> debe redimensionarse responsivamente, en relación con el ancho de su elemento principal, sin exceder su tamaño original.
|
||||
|
||||
<strong>Historia de usuario no. 9:</strong> el elemento <code>img</code> debe estar centrado dentro de su elemento primario. Puedes construir tu proyecto por medio de <a href="http://codepen.io/freeCodeCamp/pen/MJjpwO" target="_blank">este bolígrafo CodePen</a> . O puede usar este enlace CDN para ejecutar las pruebas en el entorno que desee: <code>https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js</code> . Una vez que haya terminado, envíe la URL a su proyecto de trabajo con todas las pruebas aprobadas. Recuerde usar el método de <a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/19514" target="_blank">lectura-búsqueda-pregunta</a> si se atasca. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions">
|
||||
|
|
|
|||
Loading…
Reference in New Issue