
Froggy Jumps Aventuras Web con HTML, CSS y másVersión en línea ¡Prepárate para saltar con Froggy a través del mundo del diseño web! 🐸💻 En este divertido juego pondrás a prueba tus conocimientos básicos sobre HTML, CSS, JavaScript y Bootstrap. Cada salto te llevará por desafíos donde aprenderás a crear páginas web, darles estilo, agregar interactividad y usar herramientas modernas de diseño. Ideal para estudiantes de grado 7°, este juego te ayudará a reforzar lo aprendido en clase mientras te diviertes construyendo el mundo digital paso a paso. ¡Demuestra cuánto sabes y ayuda a Froggy a llegar hasta la meta final del código perfecto! 🕹️✨ por Jhon Hevert Nuñez Blandon 1 ¿Qué significa HTML? a Hyper Text Markup Language b Hyper Text Makeup Language c Home Tool Markup Language 2 ¿Cuál es la etiqueta para crear un párrafo? a b c 3 ¿Cuál etiqueta se usa para insertar una imagen? a b c 4 ¿Qué atributo se usa para indicar la dirección de una imagen? a src b href c path 5 ¿Qué etiqueta se usa para crear un enlace? a b c 6 ¿Qué etiqueta se usa para crear una lista con viñetas? a b c 7 ¿Qué etiqueta se usa para los elementos de una lista? a b c 8 ¿Qué etiqueta contiene todo el contenido visible de la página? a b c 9 ¿Qué etiqueta se usa para los títulos grandes? a b </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> <head> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">10</span> <h3 class="gameboard__screen__question__heading"> ¿Qué atributo se usa para abrir un enlace en otra pestaña? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> target="_blank" </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> newtab="yes" </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> window="new" </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">11</span> <h3 class="gameboard__screen__question__heading"> ¿Cuál de las siguientes etiquetas sirve para insertar un video? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> <video> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> <movie> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> <media> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">12</span> <h3 class="gameboard__screen__question__heading"> ¿Cómo se define una tabla en HTML? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> <table> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> <tab> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> <t> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">13</span> <h3 class="gameboard__screen__question__heading"> ¿Qué etiqueta define una celda de tabla? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> <td> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> <cell> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> <tc> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">14</span> <h3 class="gameboard__screen__question__heading"> ¿Qué etiqueta se usa para los encabezados de tabla? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> <th> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> <thead> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> <trow> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">15</span> <h3 class="gameboard__screen__question__heading"> ¿Qué etiqueta agrupa el contenido principal del sitio? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> <main> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> <body> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> <section> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">16</span> <h3 class="gameboard__screen__question__heading"> ¿Qué significa CSS? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> Cascading Style Sheets </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> Creative Style System </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> Computer Style Syntax </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">17</span> <h3 class="gameboard__screen__question__heading"> ¿Para qué sirve CSS? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> Para dar estilo y diseño a las páginas web </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> Para escribir código de servidor </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> Para crear bases de datos </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">18</span> <h3 class="gameboard__screen__question__heading"> ¿Cómo se aplica un color al texto en CSS? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> color: red; </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> text-color: red; </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> fontcolor: red; </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">19</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad cambia el fondo? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> background-color </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> color-back </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> bg </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">20</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad cambia el tamaño de letra? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> font-size </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> text-size </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> letter-size </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">21</span> <h3 class="gameboard__screen__question__heading"> ¿Cómo se aplica un estilo directamente a una etiqueta HTML? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> Usando el atributo style </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> Usando csslink </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> Usando <design> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">22</span> <h3 class="gameboard__screen__question__heading"> ¿Qué símbolo se usa para seleccionar una clase en CSS? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> . </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> # </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> @ </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">23</span> <h3 class="gameboard__screen__question__heading"> ¿Qué símbolo se usa para seleccionar un id en CSS? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> # </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> . </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> ! </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">24</span> <h3 class="gameboard__screen__question__heading"> ¿Cuál propiedad cambia el tipo de letra? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> font-family </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> font-name </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> text-font </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">25</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad alinea el texto al centro? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> text-align: center; </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> align-text: middle; </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> text-center: true; </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">26</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad agrega un borde? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> border </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> edge </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> outline </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">27</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad agrega espacio interno en un elemento? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> padding </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> margin </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> spacing </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">28</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad agrega espacio externo en un elemento? </h3> </div> </div> <div class="gameboard__screen__wrapper"> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">a</span> <p class="gameboard__screen__answer__body"> margin </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">b</span> <p class="gameboard__screen__answer__body"> padding </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">c</span> <p class="gameboard__screen__answer__body"> border-space </p> </label> </div> </section> </article> </div> </td> </tr> </tbody> <tfoot> <tr> <td> <div class="footer-space"> </div> </td> </tr> </tfoot> </table> <div class="header-print "> <svg width="128" height="118" viewBox="0 0 128 118" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M106.464 6.38539L31.7725 0.0187284C12.983 -0.602409 -1.30315 14.3049 0.0944145 33.0943L1.18141 42.4114L8.01392 94.7422C8.94563 107.631 20.2814 117.88 33.17 117.258L94.5074 112.445C107.551 111.824 118.887 100.954 119.974 87.9097L127.894 30.6098C129.136 17.7212 119.353 6.85125 106.464 6.38539Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M45.791 66.8976H82.6565C82.9541 66.8976 83.2869 66.9007 83.6396 66.904C84.6878 66.9137 85.9108 66.925 86.9002 66.8618C88.1801 66.78 90.5329 66.5368 92.5806 64.9806C95.0015 63.1407 95.762 60.5025 95.8732 58.2984C95.9758 56.263 95.5765 54.0006 94.9963 51.6728C93.8935 47.2489 90.8713 41.556 86.0071 36.9193C81.0265 32.1717 73.8999 28.3428 64.7244 28.3428C49.8814 28.3428 32.9993 38.9707 32.9993 60.0069C32.9993 80.4653 49.9251 91.233 64.7244 91.233C74.5713 91.233 81.6933 86.6214 85.366 83.4906C87.8135 81.4043 88.1063 77.7289 86.02 75.2814C83.9336 72.834 80.2582 72.5412 77.8108 74.6275C75.35 76.7251 70.8172 79.5867 64.7244 79.5867C56.7791 79.5867 48.7135 75.1027 45.791 66.8976ZM64.7244 39.9891C56.0901 39.9891 47.2459 45.1671 45.1237 55.2513H82.6565C83.0575 55.2513 83.4407 55.2543 83.7928 55.2575C83.8216 55.2577 83.8502 55.258 83.8785 55.2582C83.8247 55.0193 83.764 54.7635 83.6957 54.4897C83.1438 52.2756 81.2879 48.5107 77.9714 45.3493C74.7712 42.2988 70.4143 39.9891 64.7244 39.9891Z" fill="white" /> </svg> </div> <div class="footer-print"> <span class="footer__logo"> <svg width="144" height="33" viewBox="0 0 144 33" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M17.038 15.6437C17.038 16.9125 16.0062 17.9582 14.7235 17.9582H3.68088V18.0977L3.49962 18.2231C4.36407 20.2588 6.34393 21.5694 8.56082 21.5694C9.81567 21.5694 11.0426 21.1232 12.0326 20.3285L12.172 20.2169C12.7855 19.6871 13.8033 19.7568 14.3331 20.3703C14.849 20.9698 14.835 21.8482 14.2913 22.4199C12.7158 23.856 10.6662 24.6368 8.54688 24.6368C4.1131 24.6368 0.376453 21.179 0.0278855 16.7592C0.0139427 16.5779 0 16.299 0 16.299V16.076C0 11.3494 3.83425 7.51514 8.56082 7.51514C12.8134 7.51514 16.4663 10.6941 17.038 14.9187V15.6437ZM3.27988 14.64C3.92124 12.2419 6.0963 10.5688 8.5781 10.5688C11.046 10.5688 13.235 12.2419 13.8763 14.64L13.946 14.877H3.21016L3.27988 14.64Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M35.6937 16.0899C35.6797 20.7886 31.8315 24.6228 27.1328 24.6228C22.4063 24.6228 18.572 20.7886 18.572 16.062C18.572 11.3354 22.4063 7.50118 27.1328 7.50118C29.0151 7.50118 30.8137 8.11465 32.3195 9.2719L32.6263 9.50893V1.53369C32.6263 0.683192 33.3095 0 34.16 0C35.0105 0 35.6937 0.683192 35.6937 1.53369V16.0899ZM21.64 16.0622C21.64 13.0366 24.1079 10.5688 27.1334 10.5688C30.159 10.5688 32.6268 13.0366 32.6268 16.0622C32.6268 19.0878 30.159 21.5556 27.1334 21.5556C24.1079 21.5556 21.64 19.0878 21.64 16.0622Z" fill="#83D41E" /> <path d="M44.7285 24.5947C48.6743 24.5947 51.8812 21.3879 51.8812 17.4421V9.13222C51.8812 8.25383 51.1561 7.52881 50.2777 7.52881C49.3994 7.52881 48.6743 8.25383 48.6743 9.13222V17.4421C48.6743 19.6171 46.9036 21.3879 44.7285 21.3879C42.5535 21.3879 40.7828 19.6171 40.7828 17.4421V9.13222C40.7828 8.25383 40.0577 7.52881 39.1793 7.52881C38.301 7.52881 37.5759 8.25383 37.5759 9.13222V17.4421C37.5759 21.3879 40.7828 24.5947 44.7285 24.5947Z" fill="#83D41E" /> <path d="M66.6322 19.5617C65.5865 20.8305 64.0389 21.5555 62.3936 21.5555C59.3541 21.5555 56.9002 19.0876 56.9002 16.0342C56.9002 13.0086 59.368 10.5408 62.3936 10.5408C64.0389 10.5408 65.5865 11.2658 66.6322 12.5346C66.925 12.8831 67.3572 13.0923 67.8173 13.0923C68.1659 13.0923 68.5145 12.9668 68.7933 12.7437C69.1001 12.4927 69.2953 12.1163 69.3371 11.7119C69.3789 11.3076 69.2534 10.9172 68.9885 10.5965C67.3433 8.61667 64.9451 7.4873 62.3797 7.4873C57.6531 7.4873 53.8188 11.3216 53.8188 16.0481C53.8188 20.7747 57.6531 24.6089 62.3797 24.6089C64.9451 24.6089 67.3572 23.4796 68.9885 21.4997C69.2534 21.193 69.3789 20.7886 69.3371 20.3843C69.3092 19.98 69.114 19.6175 68.7933 19.3525C68.5145 19.1295 68.1659 19.004 67.8173 19.004C67.3572 19.004 66.925 19.2131 66.6322 19.5617Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M87.6436 23.2423C87.6436 24.0928 86.9604 24.776 86.1099 24.776C85.2594 24.776 84.5762 24.0928 84.5762 23.2423V22.6149L84.2695 22.8519C82.7637 24.0091 80.9651 24.6226 79.0828 24.6226C74.3562 24.6226 70.522 20.7884 70.522 16.0618C70.522 11.3352 74.3562 7.50098 79.0828 7.50098C83.8094 7.50098 87.6436 11.3352 87.6436 16.0757V23.2423ZM73.579 16.062C73.579 13.0364 76.0469 10.5686 79.0724 10.5686C82.1119 10.5686 84.5798 13.0364 84.5659 16.062C84.5659 19.0875 82.098 21.5554 79.0724 21.5554C76.0469 21.5554 73.579 19.0875 73.579 16.062Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M104.5 19.2549C104.11 20.4122 103.524 21.3882 102.771 22.1829C102.018 22.9776 101.084 23.5911 99.9689 24.0233C98.8674 24.4556 97.5986 24.6647 96.1625 24.6647C95.6327 24.6647 95.061 24.6229 94.4475 24.5392C93.8341 24.4556 93.2763 24.3161 92.7744 24.1488V32.0404C92.6489 32.0683 92.4537 32.0822 92.2167 32.0962C91.9797 32.1101 91.7984 32.1101 91.6869 32.1101C91.5614 32.1101 91.3802 32.1101 91.1431 32.0962C90.9061 32.0822 90.7248 32.0683 90.5994 32.0404V7.50123C90.7248 7.47335 90.8922 7.45941 91.0874 7.44547C91.2826 7.43153 91.4499 7.43152 91.5753 7.43152C91.7008 7.43152 91.8681 7.43153 92.0633 7.44547C92.2585 7.45941 92.4259 7.47335 92.5513 7.50123L92.7465 9.80179C93.2066 9.10465 93.8759 8.47722 94.7403 7.93346C95.6048 7.38969 96.7342 7.11084 98.1145 7.11084C99.1462 7.11084 100.094 7.26421 100.945 7.58489C101.795 7.90557 102.534 8.40751 103.134 9.07676C103.733 9.75995 104.207 10.6105 104.542 11.6422C104.877 12.674 105.058 13.9149 105.058 15.3649C105.1 16.815 104.905 18.1116 104.5 19.2549ZM96.2763 9.31355C96.8898 9.13229 97.4614 9.04864 97.9913 9.04864C99.6783 9.04864 100.905 9.62029 101.658 10.7636C102.411 11.9069 102.788 13.4824 102.788 15.5041C102.788 16.7729 102.634 17.8743 102.3 18.7806C101.965 19.7008 101.519 20.4537 100.947 21.0393C100.375 21.6249 99.7062 22.0572 98.9394 22.336C98.1725 22.6009 97.3499 22.7403 96.4994 22.7403C95.5931 22.7403 94.8821 22.6846 94.3383 22.587C93.7945 22.4894 93.2786 22.336 92.7767 22.1408V14.5142C92.7767 13.4545 92.958 12.5901 93.2926 11.8929C93.6272 11.2098 94.0594 10.652 94.5753 10.2198C95.0912 9.7876 95.6629 9.4948 96.2763 9.31355Z" fill="#83D41E" /> <path d="M111.403 24.5809C111.737 24.5809 112.086 24.553 112.476 24.5112C112.853 24.4694 113.201 24.3857 113.494 24.2881C113.466 24.0232 113.438 23.7444 113.396 23.4376C113.341 23.1309 113.271 22.852 113.159 22.5871C112.992 22.629 112.769 22.6708 112.504 22.6987C112.239 22.7405 111.988 22.7544 111.751 22.7544C111.556 22.7544 111.333 22.7266 111.096 22.6987C110.859 22.6708 110.636 22.5732 110.441 22.4338C110.245 22.2804 110.078 22.0573 109.953 21.7366C109.827 21.4159 109.757 20.9698 109.757 20.3981V0.0975457C109.632 0.0696603 109.437 0.0557175 109.2 0.0417748C108.949 0.027832 108.781 0.027832 108.67 0.027832C108.53 0.027832 108.363 0.027832 108.126 0.0417748C107.889 0.0557175 107.708 0.0696603 107.582 0.0975457V20.9001C107.582 21.6669 107.694 22.2804 107.917 22.7544C108.14 23.2285 108.433 23.591 108.795 23.8699C109.144 24.1487 109.562 24.33 110.022 24.4276C110.482 24.5252 110.942 24.5809 111.403 24.5809Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M127.367 23.981C126.6 24.1344 125.666 24.2878 124.564 24.4411C123.463 24.5945 122.431 24.6782 121.441 24.6782C119.406 24.6782 117.788 24.2738 116.617 23.4651C115.446 22.6565 114.86 21.3319 114.86 19.5194C114.86 18.641 115.028 17.8602 115.376 17.163C115.711 16.4659 116.185 15.8943 116.784 15.4202C117.384 14.9462 118.109 14.5976 118.96 14.3466C119.81 14.1096 120.73 13.9841 121.734 13.9841C122.529 13.9841 123.198 14.012 123.77 14.0678C123.859 14.0764 123.945 14.0848 124.029 14.0929C124.486 14.1369 124.872 14.174 125.178 14.2211V13.2033C125.178 11.7533 124.843 10.6936 124.16 10.0244C123.477 9.35512 122.473 9.0205 121.135 9.0205C120.256 9.0205 119.461 9.07627 118.736 9.20176C118.011 9.32724 117.37 9.46667 116.798 9.64793C116.687 9.45273 116.589 9.15993 116.52 8.79741C116.436 8.42097 116.408 8.0724 116.408 7.73777C116.98 7.55652 117.677 7.41709 118.513 7.29161C119.35 7.16613 120.2 7.11035 121.079 7.11035C123.212 7.11035 124.788 7.57046 125.819 8.50462C126.851 9.43879 127.367 10.9028 127.367 12.8966V23.981ZM118.378 16.813C119.285 16.1995 120.553 15.8928 122.199 15.8928C122.701 15.8928 123.23 15.9207 123.788 15.9625C124.189 16.0026 124.539 16.0426 124.844 16.0775C124.964 16.0912 125.076 16.1041 125.182 16.1159V22.4041C124.611 22.5156 124.025 22.5992 123.44 22.669C122.84 22.7387 122.213 22.7666 121.529 22.7666C121.014 22.7666 120.484 22.7387 119.954 22.655C119.424 22.5853 118.936 22.4319 118.504 22.1949C118.058 21.9579 117.709 21.6372 117.43 21.191C117.165 20.7588 117.026 20.1732 117.026 19.4482C117.026 18.3049 117.472 17.4265 118.378 16.813Z" fill="#83D41E" /> <path d="M136.61 29.2515C136.22 30.4506 135.662 31.3011 134.937 31.7891C134.212 32.2771 133.362 32.5141 132.372 32.5141C131.912 32.5141 131.451 32.4723 130.977 32.3886C130.503 32.3049 130.113 32.2073 129.806 32.1237C129.806 31.4405 129.974 30.827 130.294 30.2832C130.475 30.353 130.726 30.4227 131.089 30.4924C131.438 30.5621 131.828 30.6039 132.274 30.6039C132.915 30.6039 133.417 30.4506 133.808 30.1438C134.198 29.8371 134.533 29.2654 134.812 28.4289L136.164 24.3437H135.537C135.341 24.3437 135.118 24.3437 134.867 24.3297C134.616 24.3158 134.421 24.3018 134.296 24.2739L128.245 7.50087C128.37 7.47298 128.565 7.45904 128.802 7.4451C129.039 7.43115 129.276 7.43115 129.499 7.43115C129.681 7.43115 129.89 7.43115 130.155 7.4451C130.42 7.45904 130.615 7.47298 130.74 7.50087L136.304 23.8138L141.769 7.50087C141.895 7.47298 142.076 7.45904 142.299 7.4451C142.522 7.43115 142.717 7.43115 142.884 7.43115C143.066 7.43115 143.261 7.43115 143.47 7.4451C143.693 7.45904 143.86 7.47298 144 7.50087L136.61 29.2515Z" fill="#83D41E" /> </svg> </span> </div> </body> </html> </div> </div> </div> <div class="e-modal__footer"> <form class="js-downloadPrintPDF" method="POST" action="//es.educaplay.com/recursos-educativos/26598345-aventuras_web_con_html_css_y_mas.html"> <input type="hidden" name="action" value="downloadprint" /> <button type="submit" class="printmodal__button e-btn e-btn--secondary disabled js-modal__close" aria-label="Imprime tu juego"> <span class="e-icon"> <svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M17 6C18.6569 6 20 7.34315 20 9V10H21.4004C22.8572 10.0002 24 11.2021 24 12.6367V18.3633C24 19.7979 22.8572 20.9998 21.4004 21H21.0693C21.0693 22.6567 19.726 23.9998 18.0693 24H12.0732C10.4165 23.9998 9.07324 22.6568 9.07324 21H8.59961C7.14279 20.9998 6 19.7979 6 18.3633V12.6367C6 11.2021 7.14279 10.0002 8.59961 10H10V9C10 7.34315 11.3431 6 13 6H17ZM12.0732 18C11.5211 18.0002 11.0732 18.4478 11.0732 19V21C11.0732 21.5522 11.5211 21.9998 12.0732 22H18.0693C18.6215 21.9998 19.0693 21.5522 19.0693 21V19C19.0693 18.4478 18.6215 18.0002 18.0693 18H12.0732ZM8.59961 12C8.28945 12.0002 8 12.2641 8 12.6367V18.3633C8 18.7359 8.28945 18.9998 8.59961 19H9.07324C9.07324 17.3432 10.4165 16.0002 12.0732 16H18.0693C19.726 16.0002 21.0693 17.3433 21.0693 19H21.4004C21.7105 18.9998 22 18.7359 22 18.3633V12.6367C22 12.2641 21.7105 12.0002 21.4004 12H8.59961ZM13 8C12.4477 8 12 8.44772 12 9V10H18V9C18 8.44772 17.5523 8 17 8H13Z" fill="currentColor"/> </svg> </span> <span class="icon-print e-btn__txt">Imprimir PDF</span> </button> </form> </div> <button class="e-btn e-btn--circular e-btn--2xs e-btn--transparent e-modal__close js-modal__close" type="button" aria-label="Cerrar"> <span class="e-icon"><svg width="lg" height="lg" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M18.2931 10.2931C18.6837 9.90261 19.3167 9.90261 19.7072 10.2931C20.0976 10.6837 20.0977 11.3167 19.7072 11.7072L16.4142 15.0002L19.7072 18.2931C20.0976 18.6837 20.0977 19.3167 19.7072 19.7072C19.3167 20.0977 18.6837 20.0976 18.2931 19.7072L15.0002 16.4142L11.7072 19.7072C11.3167 20.0977 10.6837 20.0976 10.2931 19.7072C9.90261 19.3167 9.90261 18.6837 10.2931 18.2931L13.5861 15.0002L10.2931 11.7072C9.90261 11.3167 9.90261 10.6837 10.2931 10.2931C10.6837 9.90261 11.3167 9.90261 11.7072 10.2931L15.0002 13.5861L18.2931 10.2931Z" fill="currentColor"/> </svg> </span> </button> </dialog> <dialog class="e-modal e-modal--default js-modal activityLeaveModal" id="activity-leave-modal"> <div class="e-modal__hd"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M12.5996 6C13.1519 6 13.5996 6.44772 13.5996 7C13.5996 7.55228 13.1519 8 12.5996 8H8.59961C8.26855 8.00021 8.00021 8.26855 8 8.59961V21.4004C8.00021 21.7315 8.26855 21.9998 8.59961 22H12.5996C13.1519 22 13.5996 22.4477 13.5996 23C13.5996 23.5523 13.1519 24 12.5996 24H8.59961C7.16398 23.9998 6.00021 22.836 6 21.4004V8.59961C6.00021 7.16398 7.16398 6.00021 8.59961 6H12.5996Z" fill="currentColor"/> <path d="M18.293 11.293C18.6835 10.9025 19.3165 10.9025 19.707 11.293L22.707 14.293C22.8945 14.4805 23 14.7348 23 15C23 15.2652 22.8945 15.5195 22.707 15.707L19.707 18.707C19.3165 19.0975 18.6835 19.0975 18.293 18.707C17.9024 18.3165 17.9024 17.6835 18.293 17.293L19.5859 16H11.7998C11.2476 15.9999 10.7998 15.5522 10.7998 15C10.7998 14.4478 11.2476 14.0001 11.7998 14H19.5859L18.293 12.707C17.9024 12.3165 17.9024 11.6835 18.293 11.293Z" fill="currentColor"/> </svg> </span> <span class="e-modal__hd__title">¿Estás seguro que quieres abandonar la página?</span> </div> <div class="e-modal__body"> <p class="e-modal__body__text">Al abandonar la página perderás el progreso del juego.</p> </div> <div class="e-modal__footer"> <button type="button" class="e-btn e-btn--transparent js-modal__close">Cancelar</button> <button type="button" class="e-btn e-btn--primary js-activityLeave-confirm">Abandonar</button> </div> <button class="e-btn e-btn--circular e-btn--2xs e-btn--transparent e-modal__close js-modal__close" type="button" aria-label="Cerrar"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M18.2931 10.2931C18.6837 9.90261 19.3167 9.90261 19.7072 10.2931C20.0976 10.6837 20.0977 11.3167 19.7072 11.7072L16.4142 15.0002L19.7072 18.2931C20.0976 18.6837 20.0977 19.3167 19.7072 19.7072C19.3167 20.0977 18.6837 20.0976 18.2931 19.7072L15.0002 16.4142L11.7072 19.7072C11.3167 20.0977 10.6837 20.0976 10.2931 19.7072C9.90261 19.3167 9.90261 18.6837 10.2931 18.2931L13.5861 15.0002L10.2931 11.7072C9.90261 11.3167 9.90261 10.6837 10.2931 10.2931C10.6837 9.90261 11.3167 9.90261 11.7072 10.2931L15.0002 13.5861L18.2931 10.2931Z" fill="currentColor"/> </svg> </span> </button> </dialog> </div> <footer class="footer"> <div class="footer__superior footer__superior--border-top footer__superior--padding-top footer__superior--padding-bottom footer__superior--padding-left footer__superior--padding-right"> <div class="footer__superior__google"> <p class="footer__title" aria-hidden="true">Google for Education Partner</p> <a class="footer__superior__goog-img" href="https://cloud.withgoogle.com/partners/detail/?id=educaplay" target="_blank" rel="noopener noreferrer"> <img src="https://cloud.educaplay.com/r/img/GfE-Partner-Badges-Horizontal.6a2271266f451.webp" width="140" height="107" alt="Logo Google education for partner"> </a> </div> <div class="footer__superior__google"> <p class="footer__title" aria-hidden="true">Google Classroom</p> <a class="footer__superior__goog-class" href="https://workspace.google.com/marketplace/app/educaplay/943290277704" target="_blank" rel="noopener noreferrer"> <img src="https://cloud.educaplay.com/r/img/logo_lockup_Classroom_lockup_horizontal_RGB_lockup_classroom_icon_horizontal.6a2271266fbe5.webp" width="140" height="107" alt="Logo Google Classroom"> </a> </div> <div class="footer__superior__label"> <p class="footer__title" aria-hidden="true">Protección FERPA y COPPA</p> <a href="//es.educaplay.com/politica-de-privacidad/#privacy-policy-for-children" title="Política de privacidad"> <img src="https://cloud.educaplay.com/r/img/ferpa.svg" width="65" height="64" alt="Logo Ferpa. Privacy policy for children"> <img src="https://cloud.educaplay.com/r/img/coppa.svg" width="64" height="64" alt="Logo Coppa. Privacy policy for children"> </a> </div> <div class="footer__superior__adr"> <p class="footer__title" aria-hidden="true">Educaplay es una solución de:</p> <a href="https://www.adrformacion.com/?utm_source=educaplay&utm_campaign=2025_06_pie&utm_medium=referral" class="footer__logos__adr"> <img src="https://cloud.educaplay.com/r/img/adr-logo.svg" width="115" height="24" alt="ADR Formación logo"> </a> </div> </div> <div class="footer__inferior"> <div class="footer__inferior__menu"> <p class="footer__title">Idioma</p> <div class="e-select e-select--dark"> <select aria-label="Selecciona el idioma" id="idiomaSelect" name="idioma"> <option data-lang="en" data-url="//www.educaplay.com/learning-resources/26598345-aventuras_web_con_html_css_y_mas.html" > English</option> <option data-lang="es" data-url="//es.educaplay.com/recursos-educativos/26598345-aventuras_web_con_html_css_y_mas.html" selected> Español</option> <option data-lang="fr" data-url="//fr.educaplay.com/ressources-pedagogiques/26598345-aventuras_web_con_html_css_y_mas.html" > Français</option> </select> </div> </div> <div class="footer__inferior__menu"> <p class="footer__title">Todos los juegos</p> <ul class="footer__inferior__lista"> <li><a href="//es.educaplay.com/tipos-de-actividades/">Tipos de juegos</a> </li> <li><a href="//es.educaplay.com/recursos-educativos/">Todos los juegos</a></li> <li><a href="//game.educaplay.com/">Game Pin</a></li> </ul> </div> <div class="footer__inferior__menu"> <p class="footer__title">Plataforma</p> <ul class="footer__inferior__lista"> <li><a href="//es.educaplay.com/premium/">Planes</a></li> <li><a href="//es.educaplay.com/centro-de-ayuda/">Centro de ayuda</a> </li> <li><a href="//blog.educaplay.com/es/" target="_blank">Noticias</a></li> <li><a href="//es.educaplay.com/quienes-somos.html">Quiénes somos</a></li> <li><a href="//es.educaplay.com/investigacion/">Investigación</a></li> <li><a href="//es.educaplay.com/accesibilidad/">Accesibilidad</a></li> <li><a href="https://api.educaplay.com/v1/docs/" target="_blank" rel="noopener noreferrer">Desarrolladores</a></li> </ul> </div> <div class="footer__inferior__menu"> <p class="footer__title">Legal</p> <ul class="footer__inferior__lista"> <li><a href="//es.educaplay.com/licencia/">Términos y condiciones</a></li> <li><a href="//es.educaplay.com/politica-de-privacidad/">Política de privacidad</a></li> <li><a href="//es.educaplay.com/politica-de-cookies/">Política de cookies</a></li> </ul> </div> <div class="footer__inferior__menu"> <p class="footer__title">Redes sociales</p> <ul class="footer__inferior__lista footer__inferior__social"> <li> <a rel="noopener noreferrer" href="https://www.facebook.com/educaplay" target="_blank"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M13.35 24.9C8.6 24.05 5 19.95 5 15C5 9.5 9.5 5 15 5C20.5 5 25 9.5 25 15C25 19.95 21.4 24.05 16.65 24.9L16.1 24.45H13.9L13.35 24.9Z" fill="#0062E0"/> <path d="M18.8999 17.8L19.3499 15H16.6999V13.05C16.6999 12.25 16.9999 11.65 18.1999 11.65H19.4999V9.10002C18.7999 9.00002 17.9999 8.90002 17.2999 8.90002C14.9999 8.90002 13.3999 10.3 13.3999 12.8V15H10.8999V17.8H13.3999V24.85C13.9499 24.95 14.4999 25 15.0499 25C15.5999 25 16.1499 24.95 16.6999 24.85V17.8H18.8999Z" fill="white"/> </svg> </span> Facebook </a> </li> <li> <a rel="noopener noreferrer" href="https://x.com/educaplay" target="_blank"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M25 15C25 20.5228 20.5228 25 15 25C9.47715 25 5 20.5228 5 15C5 9.47715 9.47715 5 15 5C20.5228 5 25 9.47715 25 15Z" fill="black"/> <path d="M15.9523 14.2348L19.6757 10H18.7937L15.5593 13.6763L12.978 10H10L13.9043 15.5597L10 20H10.882L14.2953 16.1169L17.022 20H20M11.2003 10.6508H12.5553L18.793 19.3812H17.4377" fill="white"/> </svg> </span> X </a> </li> <li> <a rel="noopener noreferrer" href="https://www.youtube.com/@educaplaytv7293" target="_blank" aria-hidden="true"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M25.5401 9.34243C25.2866 8.41992 24.5422 7.69497 23.595 7.44802C21.8801 7 15 7 15 7C15 7 8.12003 7 6.40501 7.44802C5.45786 7.69497 4.71354 8.41992 4.45999 9.34243C4 11.0128 4 14.5 4 14.5C4 14.5 4 17.9872 4.45999 19.6576C4.71354 20.5801 5.45786 21.305 6.40501 21.5519C8.12003 22 15 22 15 22C15 22 21.8801 22 23.595 21.5519C24.5422 21.305 25.2866 20.5801 25.5401 19.6576C26.0001 17.9872 26.0001 14.5 26.0001 14.5C26.0001 14.5 25.9982 11.0128 25.5401 9.34243Z" fill="#FF0000"/> <path d="M12.7979 17.7141L18.5134 14.5003L12.7979 11.2865V17.7141Z" fill="white"/> </svg> </span> Youtube </a> </li> <li> <a rel="noopener noreferrer" href="https://www.instagram.com/educaplay_/" target="_blank"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11.1231 6.49737C8.57268 6.49737 6.49762 8.57243 6.49762 11.1229V18.8766C6.49762 21.4271 8.57268 23.5021 11.1231 23.5021H18.8766C21.4273 23.5021 23.5024 21.4271 23.5024 18.8766V11.1229C23.5024 8.57243 21.4273 6.49737 18.8766 6.49737H11.1231ZM18.8766 24.9998H11.1231C7.74676 24.9998 5 22.2527 5 18.8766V11.1229C5 7.74677 7.74676 5.00001 11.1231 5.00001H18.8766C22.2532 5.00001 25 7.74677 25 11.1229V18.8766C25 22.2527 22.2532 24.9998 18.8766 24.9998Z" fill="#08090C"/> <path d="M14.9998 11.4743C13.0558 11.4743 11.4744 13.0558 11.4744 15C11.4744 16.9439 13.0558 18.5254 14.9998 18.5254C16.9437 18.5254 18.5255 16.9439 18.5255 15C18.5255 13.0558 16.9437 11.4743 14.9998 11.4743ZM14.9998 20.0588C12.2102 20.0588 9.94092 17.7893 9.94092 15C9.94092 12.2104 12.2102 9.94083 14.9998 9.94083C17.7894 9.94083 20.0589 12.2104 20.0589 15C20.0589 17.7893 17.7894 20.0588 14.9998 20.0588Z" fill="#08090C"/> <path d="M21.9266 9.39035C21.9266 10.1179 21.3369 10.7075 20.6094 10.7075C19.8819 10.7075 19.2922 10.1179 19.2922 9.39035C19.2922 8.66284 19.8819 8.07319 20.6094 8.07319C21.3369 8.07319 21.9266 8.66284 21.9266 9.39035Z" fill="#08090C"/> </svg> </span> Instagram </a> </li> </ul> </div> </div> <div class="footer__logos"> <div class="footer__logos__educaplay"> <img src="https://cloud.educaplay.com/r/img/educaplay-white.svg" width="80" height="20" alt="Educaplay logo"> © 2026. All rights Reserved </div> </div> </footer></body> </html>

Froggy Jumps

Aventuras Web con HTML, CSS y másVersión en línea

¡Prepárate para saltar con Froggy a través del mundo del diseño web! 🐸💻 En este divertido juego pondrás a prueba tus conocimientos básicos sobre HTML, CSS, JavaScript y Bootstrap. Cada salto te llevará por desafíos donde aprenderás a crear páginas web, darles estilo, agregar interactividad y usar herramientas modernas de diseño. Ideal para estudiantes de grado 7°, este juego te ayudará a reforzar lo aprendido en clase mientras te diviertes construyendo el mundo digital paso a paso. ¡Demuestra cuánto sabes y ayuda a Froggy a llegar hasta la meta final del código perfecto! 🕹️✨

por Jhon Hevert Nuñez Blandon

¿Qué significa HTML?

Hyper Text Markup Language

Hyper Text Makeup Language

Home Tool Markup Language

¿Cuál es la etiqueta para crear un párrafo?

c

¿Cuál etiqueta se usa para insertar una imagen?

¿Qué atributo se usa para indicar la dirección de una imagen?

src

href

path

¿Qué etiqueta se usa para crear un enlace?

¿Qué etiqueta se usa para crear una lista con viñetas?

¿Qué etiqueta se usa para los elementos de una lista?

¿Qué etiqueta contiene todo el contenido visible de la página?

¿Qué etiqueta se usa para los títulos grandes?

b
</p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> <head> </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">10</span> <h3 class="gameboardscreenquestionheading"> ¿Qué atributo se usa para abrir un enlace en otra pestaña? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswer__body"> target="_blank" </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> newtab="yes" </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> window="new" </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">11</span> <h3 class="gameboardscreenquestionheading"> ¿Cuál de las siguientes etiquetas sirve para insertar un video? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> <video> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> <movie> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> <media> </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">12</span> <h3 class="gameboardscreenquestionheading"> ¿Cómo se define una tabla en HTML? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> <table> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> <tab> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> <t> </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">13</span> <h3 class="gameboardscreenquestionheading"> ¿Qué etiqueta define una celda de tabla? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> <td> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> <cell> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> <tc> </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">14</span> <h3 class="gameboardscreenquestionheading"> ¿Qué etiqueta se usa para los encabezados de tabla? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> <th> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> <thead> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> <trow> </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">15</span> <h3 class="gameboardscreenquestionheading"> ¿Qué etiqueta agrupa el contenido principal del sitio? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> <main> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> <body> </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> <section> </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">16</span> <h3 class="gameboardscreenquestionheading"> ¿Qué significa CSS? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> Cascading Style Sheets </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> Creative Style System </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> Computer Style Syntax </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">17</span> <h3 class="gameboardscreenquestionheading"> ¿Para qué sirve CSS? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> Para dar estilo y diseño a las páginas web </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> Para escribir código de servidor </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> Para crear bases de datos </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">18</span> <h3 class="gameboardscreenquestionheading"> ¿Cómo se aplica un color al texto en CSS? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> color: red; </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> text-color: red; </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> fontcolor: red; </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">19</span> <h3 class="gameboardscreenquestionheading"> ¿Qué propiedad cambia el fondo? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> background-color </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> color-back </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> bg </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">20</span> <h3 class="gameboardscreenquestionheading"> ¿Qué propiedad cambia el tamaño de letra? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> font-size </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> text-size </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> letter-size </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">21</span> <h3 class="gameboardscreenquestionheading"> ¿Cómo se aplica un estilo directamente a una etiqueta HTML? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> Usando el atributo style </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> Usando csslink </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> Usando <design> </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">22</span> <h3 class="gameboardscreenquestionheading"> ¿Qué símbolo se usa para seleccionar una clase en CSS? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> . </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> # </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> @ </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">23</span> <h3 class="gameboardscreenquestionheading"> ¿Qué símbolo se usa para seleccionar un id en CSS? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> # </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> . </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> ! </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">24</span> <h3 class="gameboardscreenquestionheading"> ¿Cuál propiedad cambia el tipo de letra? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> font-family </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> font-name </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> text-font </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">25</span> <h3 class="gameboardscreenquestionheading"> ¿Qué propiedad alinea el texto al centro? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> text-align: center; </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> align-text: middle; </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> text-center: true; </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">26</span> <h3 class="gameboardscreenquestionheading"> ¿Qué propiedad agrega un borde? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> border </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> edge </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> outline </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">27</span> <h3 class="gameboardscreenquestionheading"> ¿Qué propiedad agrega espacio interno en un elemento? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> padding </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> margin </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> spacing </p> </label> </div> </section> <section class="gameboardscreen"> <div class="gameboardscreenwrapper"> <div class="gameboardscreenquestion"> <span class="gameboardscreenquestionnumber">28</span> <h3 class="gameboardscreenquestionheading"> ¿Qué propiedad agrega espacio externo en un elemento? </h3> </div> </div> <div class="gameboardscreenwrapper"> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">a</span> <p class="gameboardscreenanswerbody"> margin </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">b</span> <p class="gameboardscreenanswerbody"> padding </p> </label> <label class="gameboardscreenanswer"> <div class="radioinput printinput"></div> <span class="gameboardscreenanswerletter">c</span> <p class="gameboardscreenanswerbody"> border-space </p> </label> </div> </section> </article> </div> </td> </tr> </tbody> <tfoot> <tr> <td> <div class="footer-space"> </div> </td> </tr> </tfoot> </table> <div class="header-print "> <svg width="128" height="118" viewBox="0 0 128 118" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M106.464 6.38539L31.7725 0.0187284C12.983 -0.602409 -1.30315 14.3049 0.0944145 33.0943L1.18141 42.4114L8.01392 94.7422C8.94563 107.631 20.2814 117.88 33.17 117.258L94.5074 112.445C107.551 111.824 118.887 100.954 119.974 87.9097L127.894 30.6098C129.136 17.7212 119.353 6.85125 106.464 6.38539Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M45.791 66.8976H82.6565C82.9541 66.8976 83.2869 66.9007 83.6396 66.904C84.6878 66.9137 85.9108 66.925 86.9002 66.8618C88.1801 66.78 90.5329 66.5368 92.5806 64.9806C95.0015 63.1407 95.762 60.5025 95.8732 58.2984C95.9758 56.263 95.5765 54.0006 94.9963 51.6728C93.8935 47.2489 90.8713 41.556 86.0071 36.9193C81.0265 32.1717 73.8999 28.3428 64.7244 28.3428C49.8814 28.3428 32.9993 38.9707 32.9993 60.0069C32.9993 80.4653 49.9251 91.233 64.7244 91.233C74.5713 91.233 81.6933 86.6214 85.366 83.4906C87.8135 81.4043 88.1063 77.7289 86.02 75.2814C83.9336 72.834 80.2582 72.5412 77.8108 74.6275C75.35 76.7251 70.8172 79.5867 64.7244 79.5867C56.7791 79.5867 48.7135 75.1027 45.791 66.8976ZM64.7244 39.9891C56.0901 39.9891 47.2459 45.1671 45.1237 55.2513H82.6565C83.0575 55.2513 83.4407 55.2543 83.7928 55.2575C83.8216 55.2577 83.8502 55.258 83.8785 55.2582C83.8247 55.0193 83.764 54.7635 83.6957 54.4897C83.1438 52.2756 81.2879 48.5107 77.9714 45.3493C74.7712 42.2988 70.4143 39.9891 64.7244 39.9891Z" fill="white" /> </svg> </div> <div class="footer-print"> <span class="footerlogo"> <svg width="144" height="33" viewBox="0 0 144 33" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M17.038 15.6437C17.038 16.9125 16.0062 17.9582 14.7235 17.9582H3.68088V18.0977L3.49962 18.2231C4.36407 20.2588 6.34393 21.5694 8.56082 21.5694C9.81567 21.5694 11.0426 21.1232 12.0326 20.3285L12.172 20.2169C12.7855 19.6871 13.8033 19.7568 14.3331 20.3703C14.849 20.9698 14.835 21.8482 14.2913 22.4199C12.7158 23.856 10.6662 24.6368 8.54688 24.6368C4.1131 24.6368 0.376453 21.179 0.0278855 16.7592C0.0139427 16.5779 0 16.299 0 16.299V16.076C0 11.3494 3.83425 7.51514 8.56082 7.51514C12.8134 7.51514 16.4663 10.6941 17.038 14.9187V15.6437ZM3.27988 14.64C3.92124 12.2419 6.0963 10.5688 8.5781 10.5688C11.046 10.5688 13.235 12.2419 13.8763 14.64L13.946 14.877H3.21016L3.27988 14.64Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M35.6937 16.0899C35.6797 20.7886 31.8315 24.6228 27.1328 24.6228C22.4063 24.6228 18.572 20.7886 18.572 16.062C18.572 11.3354 22.4063 7.50118 27.1328 7.50118C29.0151 7.50118 30.8137 8.11465 32.3195 9.2719L32.6263 9.50893V1.53369C32.6263 0.683192 33.3095 0 34.16 0C35.0105 0 35.6937 0.683192 35.6937 1.53369V16.0899ZM21.64 16.0622C21.64 13.0366 24.1079 10.5688 27.1334 10.5688C30.159 10.5688 32.6268 13.0366 32.6268 16.0622C32.6268 19.0878 30.159 21.5556 27.1334 21.5556C24.1079 21.5556 21.64 19.0878 21.64 16.0622Z" fill="#83D41E" /> <path d="M44.7285 24.5947C48.6743 24.5947 51.8812 21.3879 51.8812 17.4421V9.13222C51.8812 8.25383 51.1561 7.52881 50.2777 7.52881C49.3994 7.52881 48.6743 8.25383 48.6743 9.13222V17.4421C48.6743 19.6171 46.9036 21.3879 44.7285 21.3879C42.5535 21.3879 40.7828 19.6171 40.7828 17.4421V9.13222C40.7828 8.25383 40.0577 7.52881 39.1793 7.52881C38.301 7.52881 37.5759 8.25383 37.5759 9.13222V17.4421C37.5759 21.3879 40.7828 24.5947 44.7285 24.5947Z" fill="#83D41E" /> <path d="M66.6322 19.5617C65.5865 20.8305 64.0389 21.5555 62.3936 21.5555C59.3541 21.5555 56.9002 19.0876 56.9002 16.0342C56.9002 13.0086 59.368 10.5408 62.3936 10.5408C64.0389 10.5408 65.5865 11.2658 66.6322 12.5346C66.925 12.8831 67.3572 13.0923 67.8173 13.0923C68.1659 13.0923 68.5145 12.9668 68.7933 12.7437C69.1001 12.4927 69.2953 12.1163 69.3371 11.7119C69.3789 11.3076 69.2534 10.9172 68.9885 10.5965C67.3433 8.61667 64.9451 7.4873 62.3797 7.4873C57.6531 7.4873 53.8188 11.3216 53.8188 16.0481C53.8188 20.7747 57.6531 24.6089 62.3797 24.6089C64.9451 24.6089 67.3572 23.4796 68.9885 21.4997C69.2534 21.193 69.3789 20.7886 69.3371 20.3843C69.3092 19.98 69.114 19.6175 68.7933 19.3525C68.5145 19.1295 68.1659 19.004 67.8173 19.004C67.3572 19.004 66.925 19.2131 66.6322 19.5617Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M87.6436 23.2423C87.6436 24.0928 86.9604 24.776 86.1099 24.776C85.2594 24.776 84.5762 24.0928 84.5762 23.2423V22.6149L84.2695 22.8519C82.7637 24.0091 80.9651 24.6226 79.0828 24.6226C74.3562 24.6226 70.522 20.7884 70.522 16.0618C70.522 11.3352 74.3562 7.50098 79.0828 7.50098C83.8094 7.50098 87.6436 11.3352 87.6436 16.0757V23.2423ZM73.579 16.062C73.579 13.0364 76.0469 10.5686 79.0724 10.5686C82.1119 10.5686 84.5798 13.0364 84.5659 16.062C84.5659 19.0875 82.098 21.5554 79.0724 21.5554C76.0469 21.5554 73.579 19.0875 73.579 16.062Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M104.5 19.2549C104.11 20.4122 103.524 21.3882 102.771 22.1829C102.018 22.9776 101.084 23.5911 99.9689 24.0233C98.8674 24.4556 97.5986 24.6647 96.1625 24.6647C95.6327 24.6647 95.061 24.6229 94.4475 24.5392C93.8341 24.4556 93.2763 24.3161 92.7744 24.1488V32.0404C92.6489 32.0683 92.4537 32.0822 92.2167 32.0962C91.9797 32.1101 91.7984 32.1101 91.6869 32.1101C91.5614 32.1101 91.3802 32.1101 91.1431 32.0962C90.9061 32.0822 90.7248 32.0683 90.5994 32.0404V7.50123C90.7248 7.47335 90.8922 7.45941 91.0874 7.44547C91.2826 7.43153 91.4499 7.43152 91.5753 7.43152C91.7008 7.43152 91.8681 7.43153 92.0633 7.44547C92.2585 7.45941 92.4259 7.47335 92.5513 7.50123L92.7465 9.80179C93.2066 9.10465 93.8759 8.47722 94.7403 7.93346C95.6048 7.38969 96.7342 7.11084 98.1145 7.11084C99.1462 7.11084 100.094 7.26421 100.945 7.58489C101.795 7.90557 102.534 8.40751 103.134 9.07676C103.733 9.75995 104.207 10.6105 104.542 11.6422C104.877 12.674 105.058 13.9149 105.058 15.3649C105.1 16.815 104.905 18.1116 104.5 19.2549ZM96.2763 9.31355C96.8898 9.13229 97.4614 9.04864 97.9913 9.04864C99.6783 9.04864 100.905 9.62029 101.658 10.7636C102.411 11.9069 102.788 13.4824 102.788 15.5041C102.788 16.7729 102.634 17.8743 102.3 18.7806C101.965 19.7008 101.519 20.4537 100.947 21.0393C100.375 21.6249 99.7062 22.0572 98.9394 22.336C98.1725 22.6009 97.3499 22.7403 96.4994 22.7403C95.5931 22.7403 94.8821 22.6846 94.3383 22.587C93.7945 22.4894 93.2786 22.336 92.7767 22.1408V14.5142C92.7767 13.4545 92.958 12.5901 93.2926 11.8929C93.6272 11.2098 94.0594 10.652 94.5753 10.2198C95.0912 9.7876 95.6629 9.4948 96.2763 9.31355Z" fill="#83D41E" /> <path d="M111.403 24.5809C111.737 24.5809 112.086 24.553 112.476 24.5112C112.853 24.4694 113.201 24.3857 113.494 24.2881C113.466 24.0232 113.438 23.7444 113.396 23.4376C113.341 23.1309 113.271 22.852 113.159 22.5871C112.992 22.629 112.769 22.6708 112.504 22.6987C112.239 22.7405 111.988 22.7544 111.751 22.7544C111.556 22.7544 111.333 22.7266 111.096 22.6987C110.859 22.6708 110.636 22.5732 110.441 22.4338C110.245 22.2804 110.078 22.0573 109.953 21.7366C109.827 21.4159 109.757 20.9698 109.757 20.3981V0.0975457C109.632 0.0696603 109.437 0.0557175 109.2 0.0417748C108.949 0.027832 108.781 0.027832 108.67 0.027832C108.53 0.027832 108.363 0.027832 108.126 0.0417748C107.889 0.0557175 107.708 0.0696603 107.582 0.0975457V20.9001C107.582 21.6669 107.694 22.2804 107.917 22.7544C108.14 23.2285 108.433 23.591 108.795 23.8699C109.144 24.1487 109.562 24.33 110.022 24.4276C110.482 24.5252 110.942 24.5809 111.403 24.5809Z" fill="#83D41E" /> <path fill-rule="evenodd" clip-rule="evenodd" d="M127.367 23.981C126.6 24.1344 125.666 24.2878 124.564 24.4411C123.463 24.5945 122.431 24.6782 121.441 24.6782C119.406 24.6782 117.788 24.2738 116.617 23.4651C115.446 22.6565 114.86 21.3319 114.86 19.5194C114.86 18.641 115.028 17.8602 115.376 17.163C115.711 16.4659 116.185 15.8943 116.784 15.4202C117.384 14.9462 118.109 14.5976 118.96 14.3466C119.81 14.1096 120.73 13.9841 121.734 13.9841C122.529 13.9841 123.198 14.012 123.77 14.0678C123.859 14.0764 123.945 14.0848 124.029 14.0929C124.486 14.1369 124.872 14.174 125.178 14.2211V13.2033C125.178 11.7533 124.843 10.6936 124.16 10.0244C123.477 9.35512 122.473 9.0205 121.135 9.0205C120.256 9.0205 119.461 9.07627 118.736 9.20176C118.011 9.32724 117.37 9.46667 116.798 9.64793C116.687 9.45273 116.589 9.15993 116.52 8.79741C116.436 8.42097 116.408 8.0724 116.408 7.73777C116.98 7.55652 117.677 7.41709 118.513 7.29161C119.35 7.16613 120.2 7.11035 121.079 7.11035C123.212 7.11035 124.788 7.57046 125.819 8.50462C126.851 9.43879 127.367 10.9028 127.367 12.8966V23.981ZM118.378 16.813C119.285 16.1995 120.553 15.8928 122.199 15.8928C122.701 15.8928 123.23 15.9207 123.788 15.9625C124.189 16.0026 124.539 16.0426 124.844 16.0775C124.964 16.0912 125.076 16.1041 125.182 16.1159V22.4041C124.611 22.5156 124.025 22.5992 123.44 22.669C122.84 22.7387 122.213 22.7666 121.529 22.7666C121.014 22.7666 120.484 22.7387 119.954 22.655C119.424 22.5853 118.936 22.4319 118.504 22.1949C118.058 21.9579 117.709 21.6372 117.43 21.191C117.165 20.7588 117.026 20.1732 117.026 19.4482C117.026 18.3049 117.472 17.4265 118.378 16.813Z" fill="#83D41E" /> <path d="M136.61 29.2515C136.22 30.4506 135.662 31.3011 134.937 31.7891C134.212 32.2771 133.362 32.5141 132.372 32.5141C131.912 32.5141 131.451 32.4723 130.977 32.3886C130.503 32.3049 130.113 32.2073 129.806 32.1237C129.806 31.4405 129.974 30.827 130.294 30.2832C130.475 30.353 130.726 30.4227 131.089 30.4924C131.438 30.5621 131.828 30.6039 132.274 30.6039C132.915 30.6039 133.417 30.4506 133.808 30.1438C134.198 29.8371 134.533 29.2654 134.812 28.4289L136.164 24.3437H135.537C135.341 24.3437 135.118 24.3437 134.867 24.3297C134.616 24.3158 134.421 24.3018 134.296 24.2739L128.245 7.50087C128.37 7.47298 128.565 7.45904 128.802 7.4451C129.039 7.43115 129.276 7.43115 129.499 7.43115C129.681 7.43115 129.89 7.43115 130.155 7.4451C130.42 7.45904 130.615 7.47298 130.74 7.50087L136.304 23.8138L141.769 7.50087C141.895 7.47298 142.076 7.45904 142.299 7.4451C142.522 7.43115 142.717 7.43115 142.884 7.43115C143.066 7.43115 143.261 7.43115 143.47 7.4451C143.693 7.45904 143.86 7.47298 144 7.50087L136.61 29.2515Z" fill="#83D41E" /> </svg> </span> </div> </body> </html> </div> </div> </div> <div class="e-modalfooter"> <form class="js-downloadPrintPDF" method="POST" action="//es.educaplay.com/recursos-educativos/26598345-aventuras_web_con_html_css_y_mas.html"> <input type="hidden" name="action" value="downloadprint" /> <button type="submit" class="printmodalbutton e-btn e-btn--secondary disabled js-modalclose" aria-label="Imprime tu juego"> <span class="e-icon"> <svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M17 6C18.6569 6 20 7.34315 20 9V10H21.4004C22.8572 10.0002 24 11.2021 24 12.6367V18.3633C24 19.7979 22.8572 20.9998 21.4004 21H21.0693C21.0693 22.6567 19.726 23.9998 18.0693 24H12.0732C10.4165 23.9998 9.07324 22.6568 9.07324 21H8.59961C7.14279 20.9998 6 19.7979 6 18.3633V12.6367C6 11.2021 7.14279 10.0002 8.59961 10H10V9C10 7.34315 11.3431 6 13 6H17ZM12.0732 18C11.5211 18.0002 11.0732 18.4478 11.0732 19V21C11.0732 21.5522 11.5211 21.9998 12.0732 22H18.0693C18.6215 21.9998 19.0693 21.5522 19.0693 21V19C19.0693 18.4478 18.6215 18.0002 18.0693 18H12.0732ZM8.59961 12C8.28945 12.0002 8 12.2641 8 12.6367V18.3633C8 18.7359 8.28945 18.9998 8.59961 19H9.07324C9.07324 17.3432 10.4165 16.0002 12.0732 16H18.0693C19.726 16.0002 21.0693 17.3433 21.0693 19H21.4004C21.7105 18.9998 22 18.7359 22 18.3633V12.6367C22 12.2641 21.7105 12.0002 21.4004 12H8.59961ZM13 8C12.4477 8 12 8.44772 12 9V10H18V9C18 8.44772 17.5523 8 17 8H13Z" fill="currentColor"/> </svg> </span> <span class="icon-print e-btntxt">Imprimir PDF</span> </button> </form> </div> <button class="e-btn e-btn--circular e-btn--2xs e-btn--transparent e-modalclose js-modalclose" type="button" aria-label="Cerrar"> <span class="e-icon"><svg width="lg" height="lg" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M18.2931 10.2931C18.6837 9.90261 19.3167 9.90261 19.7072 10.2931C20.0976 10.6837 20.0977 11.3167 19.7072 11.7072L16.4142 15.0002L19.7072 18.2931C20.0976 18.6837 20.0977 19.3167 19.7072 19.7072C19.3167 20.0977 18.6837 20.0976 18.2931 19.7072L15.0002 16.4142L11.7072 19.7072C11.3167 20.0977 10.6837 20.0976 10.2931 19.7072C9.90261 19.3167 9.90261 18.6837 10.2931 18.2931L13.5861 15.0002L10.2931 11.7072C9.90261 11.3167 9.90261 10.6837 10.2931 10.2931C10.6837 9.90261 11.3167 9.90261 11.7072 10.2931L15.0002 13.5861L18.2931 10.2931Z" fill="currentColor"/> </svg> </span> </button> </dialog> <dialog class="e-modal e-modal--default js-modal activityLeaveModal" id="activity-leave-modal"> <div class="e-modalhd"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M12.5996 6C13.1519 6 13.5996 6.44772 13.5996 7C13.5996 7.55228 13.1519 8 12.5996 8H8.59961C8.26855 8.00021 8.00021 8.26855 8 8.59961V21.4004C8.00021 21.7315 8.26855 21.9998 8.59961 22H12.5996C13.1519 22 13.5996 22.4477 13.5996 23C13.5996 23.5523 13.1519 24 12.5996 24H8.59961C7.16398 23.9998 6.00021 22.836 6 21.4004V8.59961C6.00021 7.16398 7.16398 6.00021 8.59961 6H12.5996Z" fill="currentColor"/> <path d="M18.293 11.293C18.6835 10.9025 19.3165 10.9025 19.707 11.293L22.707 14.293C22.8945 14.4805 23 14.7348 23 15C23 15.2652 22.8945 15.5195 22.707 15.707L19.707 18.707C19.3165 19.0975 18.6835 19.0975 18.293 18.707C17.9024 18.3165 17.9024 17.6835 18.293 17.293L19.5859 16H11.7998C11.2476 15.9999 10.7998 15.5522 10.7998 15C10.7998 14.4478 11.2476 14.0001 11.7998 14H19.5859L18.293 12.707C17.9024 12.3165 17.9024 11.6835 18.293 11.293Z" fill="currentColor"/> </svg> </span> <span class="e-modalhdtitle">¿Estás seguro que quieres abandonar la página?</span> </div> <div class="e-modalbody"> <p class="e-modalbodytext">Al abandonar la página perderás el progreso del juego.</p> </div> <div class="e-modalfooter"> <button type="button" class="e-btn e-btn--transparent js-modalclose">Cancelar</button> <button type="button" class="e-btn e-btn--primary js-activityLeave-confirm">Abandonar</button> </div> <button class="e-btn e-btn--circular e-btn--2xs e-btn--transparent e-modalclose js-modalclose" type="button" aria-label="Cerrar"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M18.2931 10.2931C18.6837 9.90261 19.3167 9.90261 19.7072 10.2931C20.0976 10.6837 20.0977 11.3167 19.7072 11.7072L16.4142 15.0002L19.7072 18.2931C20.0976 18.6837 20.0977 19.3167 19.7072 19.7072C19.3167 20.0977 18.6837 20.0976 18.2931 19.7072L15.0002 16.4142L11.7072 19.7072C11.3167 20.0977 10.6837 20.0976 10.2931 19.7072C9.90261 19.3167 9.90261 18.6837 10.2931 18.2931L13.5861 15.0002L10.2931 11.7072C9.90261 11.3167 9.90261 10.6837 10.2931 10.2931C10.6837 9.90261 11.3167 9.90261 11.7072 10.2931L15.0002 13.5861L18.2931 10.2931Z" fill="currentColor"/> </svg> </span> </button> </dialog> </div> <footer class="footer"> <div class="footersuperior footersuperior--border-top footersuperior--padding-top footersuperior--padding-bottom footersuperior--padding-left footersuperior--padding-right"> <div class="footersuperiorgoogle"> <p class="footertitle" aria-hidden="true">Google for Education Partner</p> <a class="footersuperiorgoog-img" href="https://cloud.withgoogle.com/partners/detail/?id=educaplay" target="_blank" rel="noopener noreferrer"> <img src="https://cloud.educaplay.com/r/img/GfE-Partner-Badges-Horizontal.6a2271266f451.webp" width="140" height="107" alt="Logo Google education for partner"> </a> </div> <div class="footersuperiorgoogle"> <p class="footertitle" aria-hidden="true">Google Classroom</p> <a class="footersuperior__goog-class" href="https://workspace.google.com/marketplace/app/educaplay/943290277704" target="_blank" rel="noopener noreferrer"> <img src="https://cloud.educaplay.com/r/img/logo_lockup_Classroom_lockup_horizontal_RGB_lockup_classroom_icon_horizontal.6a2271266fbe5.webp" width="140" height="107" alt="Logo Google Classroom"> </a> </div> <div class="footersuperiorlabel"> <p class="footertitle" aria-hidden="true">Protección FERPA y COPPA</p> <a href="//es.educaplay.com/politica-de-privacidad/#privacy-policy-for-children" title="Política de privacidad"> <img src="https://cloud.educaplay.com/r/img/ferpa.svg" width="65" height="64" alt="Logo Ferpa. Privacy policy for children"> <img src="https://cloud.educaplay.com/r/img/coppa.svg" width="64" height="64" alt="Logo Coppa. Privacy policy for children"> </a> </div> <div class="footersuperioradr"> <p class="footertitle" aria-hidden="true">Educaplay es una solución de:</p> <a href="https://www.adrformacion.com/?utm_source=educaplay&utm_campaign=2025_06_pie&utm_medium=referral" class="footerlogosadr"> <img src="https://cloud.educaplay.com/r/img/adr-logo.svg" width="115" height="24" alt="ADR Formación logo"> </a> </div> </div> <div class="footerinferior"> <div class="footerinferiormenu"> <p class="footertitle">Idioma</p> <div class="e-select e-select--dark"> <select aria-label="Selecciona el idioma" id="idiomaSelect" name="idioma"> <option data-lang="en" data-url="//www.educaplay.com/learning-resources/26598345-aventuras_web_con_html_css_y_mas.html" > English</option> <option data-lang="es" data-url="//es.educaplay.com/recursos-educativos/26598345-aventuras_web_con_html_css_y_mas.html" selected> Español</option> <option data-lang="fr" data-url="//fr.educaplay.com/ressources-pedagogiques/26598345-aventuras_web_con_html_css_y_mas.html" > Français</option> </select> </div> </div> <div class="footerinferiormenu"> <p class="footertitle">Todos los juegos</p> <ul class="footerinferiorlista"> <li><a href="//es.educaplay.com/tipos-de-actividades/">Tipos de juegos</a> </li> <li><a href="//es.educaplay.com/recursos-educativos/">Todos los juegos</a></li> <li><a href="//game.educaplay.com/">Game Pin</a></li> </ul> </div> <div class="footerinferiormenu"> <p class="footertitle">Plataforma</p> <ul class="footerinferiorlista"> <li><a href="//es.educaplay.com/premium/">Planes</a></li> <li><a href="//es.educaplay.com/centro-de-ayuda/">Centro de ayuda</a> </li> <li><a href="//blog.educaplay.com/es/" target="_blank">Noticias</a></li> <li><a href="//es.educaplay.com/quienes-somos.html">Quiénes somos</a></li> <li><a href="//es.educaplay.com/investigacion/">Investigación</a></li> <li><a href="//es.educaplay.com/accesibilidad/">Accesibilidad</a></li> <li><a href="https://api.educaplay.com/v1/docs/" target="_blank" rel="noopener noreferrer">Desarrolladores</a></li> </ul> </div> <div class="footerinferiormenu"> <p class="footertitle">Legal</p> <ul class="footerinferiorlista"> <li><a href="//es.educaplay.com/licencia/">Términos y condiciones</a></li> <li><a href="//es.educaplay.com/politica-de-privacidad/">Política de privacidad</a></li> <li><a href="//es.educaplay.com/politica-de-cookies/">Política de cookies</a></li> </ul> </div> <div class="footerinferiormenu"> <p class="footertitle">Redes sociales</p> <ul class="footerinferiorlista footerinferiorsocial"> <li> <a rel="noopener noreferrer" href="https://www.facebook.com/educaplay" target="_blank"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M13.35 24.9C8.6 24.05 5 19.95 5 15C5 9.5 9.5 5 15 5C20.5 5 25 9.5 25 15C25 19.95 21.4 24.05 16.65 24.9L16.1 24.45H13.9L13.35 24.9Z" fill="#0062E0"/> <path d="M18.8999 17.8L19.3499 15H16.6999V13.05C16.6999 12.25 16.9999 11.65 18.1999 11.65H19.4999V9.10002C18.7999 9.00002 17.9999 8.90002 17.2999 8.90002C14.9999 8.90002 13.3999 10.3 13.3999 12.8V15H10.8999V17.8H13.3999V24.85C13.9499 24.95 14.4999 25 15.0499 25C15.5999 25 16.1499 24.95 16.6999 24.85V17.8H18.8999Z" fill="white"/> </svg> </span> Facebook </a> </li> <li> <a rel="noopener noreferrer" href="https://x.com/educaplay" target="_blank"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M25 15C25 20.5228 20.5228 25 15 25C9.47715 25 5 20.5228 5 15C5 9.47715 9.47715 5 15 5C20.5228 5 25 9.47715 25 15Z" fill="black"/> <path d="M15.9523 14.2348L19.6757 10H18.7937L15.5593 13.6763L12.978 10H10L13.9043 15.5597L10 20H10.882L14.2953 16.1169L17.022 20H20M11.2003 10.6508H12.5553L18.793 19.3812H17.4377" fill="white"/> </svg> </span> X </a> </li> <li> <a rel="noopener noreferrer" href="https://www.youtube.com/@educaplaytv7293" target="_blank" aria-hidden="true"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M25.5401 9.34243C25.2866 8.41992 24.5422 7.69497 23.595 7.44802C21.8801 7 15 7 15 7C15 7 8.12003 7 6.40501 7.44802C5.45786 7.69497 4.71354 8.41992 4.45999 9.34243C4 11.0128 4 14.5 4 14.5C4 14.5 4 17.9872 4.45999 19.6576C4.71354 20.5801 5.45786 21.305 6.40501 21.5519C8.12003 22 15 22 15 22C15 22 21.8801 22 23.595 21.5519C24.5422 21.305 25.2866 20.5801 25.5401 19.6576C26.0001 17.9872 26.0001 14.5 26.0001 14.5C26.0001 14.5 25.9982 11.0128 25.5401 9.34243Z" fill="#FF0000"/> <path d="M12.7979 17.7141L18.5134 14.5003L12.7979 11.2865V17.7141Z" fill="white"/> </svg> </span> Youtube </a> </li> <li> <a rel="noopener noreferrer" href="https://www.instagram.com/educaplay_/" target="_blank"> <span class="e-icon"><svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11.1231 6.49737C8.57268 6.49737 6.49762 8.57243 6.49762 11.1229V18.8766C6.49762 21.4271 8.57268 23.5021 11.1231 23.5021H18.8766C21.4273 23.5021 23.5024 21.4271 23.5024 18.8766V11.1229C23.5024 8.57243 21.4273 6.49737 18.8766 6.49737H11.1231ZM18.8766 24.9998H11.1231C7.74676 24.9998 5 22.2527 5 18.8766V11.1229C5 7.74677 7.74676 5.00001 11.1231 5.00001H18.8766C22.2532 5.00001 25 7.74677 25 11.1229V18.8766C25 22.2527 22.2532 24.9998 18.8766 24.9998Z" fill="#08090C"/> <path d="M14.9998 11.4743C13.0558 11.4743 11.4744 13.0558 11.4744 15C11.4744 16.9439 13.0558 18.5254 14.9998 18.5254C16.9437 18.5254 18.5255 16.9439 18.5255 15C18.5255 13.0558 16.9437 11.4743 14.9998 11.4743ZM14.9998 20.0588C12.2102 20.0588 9.94092 17.7893 9.94092 15C9.94092 12.2104 12.2102 9.94083 14.9998 9.94083C17.7894 9.94083 20.0589 12.2104 20.0589 15C20.0589 17.7893 17.7894 20.0588 14.9998 20.0588Z" fill="#08090C"/> <path d="M21.9266 9.39035C21.9266 10.1179 21.3369 10.7075 20.6094 10.7075C19.8819 10.7075 19.2922 10.1179 19.2922 9.39035C19.2922 8.66284 19.8819 8.07319 20.6094 8.07319C21.3369 8.07319 21.9266 8.66284 21.9266 9.39035Z" fill="#08090C"/> </svg> </span> Instagram </a> </li> </ul> </div> </div> <div class="footerlogos"> <div class="footerlogos__educaplay"> <img src="https://cloud.educaplay.com/r/img/educaplay-white.svg" width="80" height="20" alt="Educaplay logo"> © 2026. All rights Reserved </div> </div> </footer></body> </html>

#	Jugador	Acierto	tiempo
1	Jhon Hevert Nuñez Blandon 15 de Noviembre de 2025	% 68	03:02
2	Liceth Jireth 12 de Noviembre de 2025	% 50	01:51
3	JP BOY 12 de Noviembre de 2025	% 39	01:47
4	Santiago Vanin Mena 12 de Noviembre de 2025	% 29	01:20
5	JeritoAG10 12 de Noviembre de 2025	% 25	01:29
6	Jerielcito 12 de Noviembre de 2025	% 21	01:11
7	Yuin 12 de Noviembre de 2025	% 21	01:36
8	serena 12 de Noviembre de 2025	% 21	01:42
9	004432 12 de Noviembre de 2025	% 18	00:58
10	camilla 12 de Noviembre de 2025	% 14	01:12

Puedes integrar el juego en un LMS compatible con LTI 1.1 o LTI 1.3 como Canvas, Moodle, o Blackboard. De esta manera podrás guardar las puntuaciones automáticamente en el libro de calificaciones de esa plataforma.

Aventuras Web con HTML, CSS y más

Froggy Jumps

Sobre esta actividad

Creada por

Descarga la versión para jugar en papel

Top juegos

Froggy Jumps

Salva a la Ranita

Froggy Jumps

OPEN UP 6 UNIT 1 VOCABULARY

Froggy Jumps

Quiz de Culpa mía película

Froggy Jumps

El valle de los lobos

Froggy Jumps

Sabiduría animal

Froggy Jumps

Aventuras Web con HTML, CSS y másVersión en línea

por Jhon Hevert Nuñez Blandon

¿Qué significa HTML?

¿Cuál es la etiqueta para crear un párrafo?

c

¿Cuál etiqueta se usa para insertar una imagen?

¿Qué atributo se usa para indicar la dirección de una imagen?

¿Qué etiqueta se usa para crear un enlace?

¿Qué etiqueta se usa para crear una lista con viñetas?

¿Qué etiqueta se usa para los elementos de una lista?

¿Qué etiqueta contiene todo el contenido visible de la página?

¿Qué etiqueta se usa para los títulos grandes?

		%
	Anónimo	%
		%
		%