Test: Desafío de HTML y CSS


Desafío de HTML y CSSVersión en línea Pon a prueba tus conocimientos sobre HTML y CSS con este juego de preguntas. por Diego Rocha 1 ¿Qué significa HTML? a High Tech Markup Language b HyperText Markup Language c Hyper Transfer Markup Language d Hyperlink Text Markup Language 2 ¿Cuál es el elemento principal de una página web en HTML? a b c </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> <html> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">3</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad de CSS se utiliza para cambiar el color de fondo de 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"> background-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"> background-color </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"> color-background </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> text-color </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">4</span> <h3 class="gameboard__screen__question__heading"> ¿Cuál es la forma correcta de comentar 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"> <! Comentario > </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"> <!-- Comentario --> </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"> // Comentario </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> <# Comentario #> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">5</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 Sheets </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"> Coded Style Sheets </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> Computer Style Sheets </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">6</span> <h3 class="gameboard__screen__question__heading"> ¿Cuál es el selector que aplica un estilo a todos los elementos de una página 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"> body </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</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">7</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad de CSS se utiliza para cambiar el tamaño de fuente de un texto? </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"> 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"> font-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"> text-size </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> font-style </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">8</span> <h3 class="gameboard__screen__question__heading"> ¿Cuál es el valor predeterminado del atributo 'display' 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"> inline </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"> flex </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"> grid </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> block </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">9</span> <h3 class="gameboard__screen__question__heading"> ¿Qué etiqueta se utiliza para definir un enlace 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"> <link> </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"> <a> </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"> <href> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> <url> </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"> ¿Cuál es el símbolo que se utiliza para referenciar 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> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> . </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 "> <img src="https://cloud.educaplay.com/r2/img/printBanner.png?v=1745937949" alt="educaplay suscripción"> <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> </div> </div> <div class="modal__footer"> <form class="js-downloadPrintPDF" method="POST" action="//es.educaplay.com/recursos-educativos/"> <input type="hidden" name="action" value="downloadprint" /> <input type="hidden" name="slug" value=19175860-desafio_de_html_y_css.html /> <button type="submit" class="printmodal__button e-btn e-btn__secondary disabled js-modal__close" aria-label="Imprime tu juego"> <span class="e__ico" aria-label=""> <img src="https://cloud.educaplay.com/r2/img/iconos/print.svg?v=1745937949" width="30" height="30" alt=""> </span> <span class="icon-print">Imprimir PDF</span> </button> </form> </div> </dialog> <footer class="footer"> <div class="footer__superior"> <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/r2/img/GfE-Partner-Badges-Horizontal.webp?v=1745937949" 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/r2/img/logo_lockup_Classroom_lockup_horizontal_RGB_lockup_classroom_icon_horizontal.webp?v=1745937949" 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/r2/img/ferpa.svg?v=1745937949" width="65" height="64" alt="Logo Ferpa. Privacy policy for children"> <img src="https://cloud.educaplay.com/r2/img/coppa.svg?v=1745937949" width="64" height="64" alt="Logo Coppa. Privacy policy for children"> </a> </div> </div> <div class="footer__inferior"> <div class="footer__inferior__menu"> <p class="footer__title">Idioma</p> <select aria-label="Selecciona el idioma" id="idiomaSelect" name="idioma"> <option data-lang="en" data-url="//www.educaplay.com/learning-resources/19175860-desafio_de_html_y_css.html?lang=en">English</option> <option data-lang="es" data-url="//es.educaplay.com/recursos-educativos/19175860-desafio_de_html_y_css.html" selected>Español</option> <option data-lang="fr" data-url="//fr.educaplay.com/ressources-pedagogiques/19175860-desafio_de_html_y_css.html?lang=fr">Français</option> </select> </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> </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" > <img src="https://cloud.educaplay.com/r2/img/iconos/facebook.svg?v=1745937949" alt="Facebook logo" aria-hidden="true"> Facebook </a> </li> <li> <a rel="noopener noreferrer" href="https://x.com/educaplay" target="_blank" > <img src="https://cloud.educaplay.com/r2/img/iconos/x.svg?v=1745937949" alt="X logo" aria-hidden="true"> X </a> </li> <li> <a rel="noopener noreferrer" href="https://www.youtube.com/@educaplaytv7293" target="_blank" aria-hidden="true" > <img src="https://cloud.educaplay.com/r2/img/iconos/youtube.svg?v=1745937949" alt="Youtube logo" > Youtube </a> </li> <li> <a rel="noopener noreferrer" href="https://www.instagram.com/educaplay_/" target="_blank" > <img src="https://cloud.educaplay.com/r2/img/iconos/instagram.svg?v=1745937949" alt="Instagram logo" aria-hidden="true" > Instagram </a> </li> </ul> </div> </div> <div class="footer__logos"> <div class="footer__logos__educaplay"> <img src="https://cloud.educaplay.com/r2/img/educaplay-white.svg?v=1745937949" width="80" height="20" alt="Educaplay logo" > © 2025. All rights Reserved </div> <a href="https://www.adrformacion.com/" class="footer__logos__adr" > <img src="https://cloud.educaplay.com/r2/img/adr-logo-white.svg?v=1745937949" width="115" height="24" alt="ADR Formación logo" > </a> </div> </footer></body> </html>

Desafío de HTML y CSSVersión en línea

Pon a prueba tus conocimientos sobre HTML y CSS con este juego de preguntas.

por Diego Rocha

¿Qué significa HTML?

High Tech Markup Language

HyperText Markup Language

Hyper Transfer Markup Language

Hyperlink Text Markup Language

¿Cuál es el elemento principal de una página web en HTML?

</p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> <html> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">3</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad de CSS se utiliza para cambiar el color de fondo de 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"> background-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"> background-color </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"> color-background </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> text-color </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">4</span> <h3 class="gameboard__screen__question__heading"> ¿Cuál es la forma correcta de comentar 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"> <! Comentario > </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"> // Comentario </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> <# Comentario #> </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">5</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 Sheets </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"> Coded Style Sheets </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> Computer Style Sheets </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">6</span> <h3 class="gameboard__screen__question__heading"> ¿Cuál es el selector que aplica un estilo a todos los elementos de una página 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"> body </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</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">7</span> <h3 class="gameboard__screen__question__heading"> ¿Qué propiedad de CSS se utiliza para cambiar el tamaño de fuente de un texto? </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"> 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"> font-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"> text-size </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> font-style </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">8</span> <h3 class="gameboard__screen__question__heading"> ¿Cuál es el valor predeterminado del atributo 'display' 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"> inline </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"> flex </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"> grid </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> block </p> </label> </div> </section> <section class="gameboard__screen"> <div class="gameboard__screen__wrapper"> <div class="gameboard__screen__question"> <span class="gameboard__screen__question__number">9</span> <h3 class="gameboard__screen__question__heading"> ¿Qué etiqueta se utiliza para definir un enlace 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"> <link> </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"> <a> </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"> <href> </p> </label> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> <url> </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"> ¿Cuál es el símbolo que se utiliza para referenciar 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> <label class="gameboard__screen__answer"> <div class="radioinput printinput"></div> <span class="gameboard__screen__answer__letter">d</span> <p class="gameboard__screen__answer__body"> . </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 "> <img src="https://cloud.educaplay.com/r2/img/printBanner.png?v=1745937949" alt="educaplay suscripción"> <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> </div> </div> <div class="modal__footer"> <form class="js-downloadPrintPDF" method="POST" action="//es.educaplay.com/recursos-educativos/"> <input type="hidden" name="action" value="downloadprint" /> <input type="hidden" name="slug" value=19175860-desafio_de_html_y_css.html /> <button type="submit" class="printmodal__button e-btn e-btn__secondary disabled js-modal__close" aria-label="Imprime tu juego"> <span class="e__ico" aria-label=""> <img src="https://cloud.educaplay.com/r2/img/iconos/print.svg?v=1745937949" width="30" height="30" alt=""> </span> <span class="icon-print">Imprimir PDF</span> </button> </form> </div> </dialog> <footer class="footer"> <div class="footer__superior"> <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/r2/img/GfE-Partner-Badges-Horizontal.webp?v=1745937949" 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/r2/img/logo_lockup_Classroom_lockup_horizontal_RGB_lockup_classroom_icon_horizontal.webp?v=1745937949" 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/r2/img/ferpa.svg?v=1745937949" width="65" height="64" alt="Logo Ferpa. Privacy policy for children"> <img src="https://cloud.educaplay.com/r2/img/coppa.svg?v=1745937949" width="64" height="64" alt="Logo Coppa. Privacy policy for children"> </a> </div> </div> <div class="footer__inferior"> <div class="footer__inferior__menu"> <p class="footer__title">Idioma</p> <select aria-label="Selecciona el idioma" id="idiomaSelect" name="idioma"> <option data-lang="en" data-url="//www.educaplay.com/learning-resources/19175860-desafio_de_html_y_css.html?lang=en">English</option> <option data-lang="es" data-url="//es.educaplay.com/recursos-educativos/19175860-desafio_de_html_y_css.html" selected>Español</option> <option data-lang="fr" data-url="//fr.educaplay.com/ressources-pedagogiques/19175860-desafio_de_html_y_css.html?lang=fr">Français</option> </select> </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> </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" > <img src="https://cloud.educaplay.com/r2/img/iconos/facebook.svg?v=1745937949" alt="Facebook logo" aria-hidden="true"> Facebook </a> </li> <li> <a rel="noopener noreferrer" href="https://x.com/educaplay" target="_blank" > <img src="https://cloud.educaplay.com/r2/img/iconos/x.svg?v=1745937949" alt="X logo" aria-hidden="true"> X </a> </li> <li> <a rel="noopener noreferrer" href="https://www.youtube.com/@educaplaytv7293" target="_blank" aria-hidden="true" > <img src="https://cloud.educaplay.com/r2/img/iconos/youtube.svg?v=1745937949" alt="Youtube logo" > Youtube </a> </li> <li> <a rel="noopener noreferrer" href="https://www.instagram.com/educaplay_/" target="_blank" > <img src="https://cloud.educaplay.com/r2/img/iconos/instagram.svg?v=1745937949" alt="Instagram logo" aria-hidden="true" > Instagram </a> </li> </ul> </div> </div> <div class="footer__logos"> <div class="footer__logos__educaplay"> <img src="https://cloud.educaplay.com/r2/img/educaplay-white.svg?v=1745937949" width="80" height="20" alt="Educaplay logo" > © 2025. All rights Reserved </div> <a href="https://www.adrformacion.com/" class="footer__logos__adr" > <img src="https://cloud.educaplay.com/r2/img/adr-logo-white.svg?v=1745937949" width="115" height="24" alt="ADR Formación logo" > </a> </div> </footer></body> </html>

Desafío de HTML y CSS

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

Desafío de HTML y CSS

Test

Descarga la versión para jugar en papel

Creada por

Top 10 resultados

Top juegos

Test

cuanto sabes de Futbol

Test

Cultura general española

Test

Brawl stars preguntas

Test

Verbos irregulares en Inglés

Test

Tipos de sintagmas (II)

Desafío de HTML y CSSVersión en línea

por Diego Rocha

¿Qué significa HTML?

¿Cuál es el elemento principal de una página web en HTML?