Files
freeCodeCamp/curriculum/challenges/espanol/01-responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element.md
camperbot 5075f14248 chore(i18n,learn): processed translations (#41378)
* chore(i8n,learn): processed translations

* Update curriculum/challenges/chinese/01-responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text.md

Co-authored-by: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>

Co-authored-by: Crowdin Bot <support+bot@crowdin.com>
Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com>
Co-authored-by: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>
2021-03-05 07:43:24 -08:00

2.5 KiB

id, title, challengeType, videoUrl, forumTopicId, dashedName
id title challengeType videoUrl forumTopicId dashedName
587d774e367417b2b2512a9f Salta directamente al contenido usando el elemento principal (main) 0 https://scrimba.com/c/cPp7zuE 301018 jump-straight-to-the-content-using-the-main-element

--description--

HTML5 introdujo una serie de nuevos elementos que ofrecen a los desarrolladores más opciones al tiempo que incorporan características de accesibilidad. Estas etiquetas incluyen main, header, footer, nav, article, y section, entre otros.

De forma predeterminada, un navegador muestra estos elementos de forma similar al humilde div. Sin embargo, usarlos cuando sea apropiado le da un significado adicional a tu lenguaje de marcado. El nombre de la etiqueta solo puede indicar el tipo de información que contiene, lo que agrega significado semántico a ese contenido. Las tecnologías de asistencia pueden acceder a esta información para proporcionar mejores opciones de resumen de páginas o de navegación a sus usuarios.

El elemento main se usa para envolver (lo adivinaste) el contenido principal, y solo debe haber uno por página. Está destinado a rodear la información que está relacionada con el tema central de su página. No está destinado a incluir elementos que se repiten en todas las páginas, como enlaces de navegación o banners.

La etiqueta main también tiene una característica de referencia insertada que la tecnología de asistencia puede usar para navegar rápidamente al contenido principal. Si alguna vez has visto un enlace de "Saltar al contenido principal" en la parte superior de la página, el uso de la etiqueta main proporciona automáticamente esa funcionalidad a los dispositivos de asistencia.

--instructions--

Camper Cat tiene algunas grandes ideas para su página de armas ninja. Ayúdelo a configurar su marcado agregado etiquetas de apertura y cierre main entre el header y el footer (cubierto en otros desafíos). Mantenga las etiquetas main vacías por ahora.

--hints--

Tu código debe tener una etiqueta main.

assert($('main').length == 1);

Las etiquetas main deben estar entre la etiqueta header de cierre y la etiqueta footer de apertura.

assert(code.match(/<\/header>\s*?<main>\s*?<\/main>/gi));

--seed--

--seed-contents--

<header>
  <h1>Weapons of the Ninja</h1>
</header>



<footer></footer>

--solutions--

<header>
  <h1>Weapons of the Ninja</h1>
</header>
<main>

</main>
<footer></footer>