freeCodeCamp

4.3 KiB

Raw Blame History

id	title	challengeType	videoUrl	localeTitle
587d774e367417b2b2512a9f	Jump Straight to the Content Using the main Element	0		Перейти прямо к контенту, используя элемент main

Description

В HTML5 появилось несколько новых элементов, которые предоставляют разработчикам больше опций, а также включают функции доступности. Эти теги включают в себя main, header, footer, nav, article и section, среди прочих. По умолчанию браузер отображает эти элементы аналогично традиционному div . Однако использование их в соответствующих случаях дает дополнительный смысл в вашей разметке. Имя тега может указывать на тип информации, который он содержит, что добавляет семантический смысл этому контенту. Вспомогательные технологии могут получить доступ к этой информации, чтобы предоставить пользователям более подробные сведения о странице или вариантах навигации. Элемент main используется для обертывания (как вы уже догадались) основного содержимого, и на странице должно быть только один такой элемент. Он предназначен для того, чтобы обертывать информацию, связанную с центральной темой вашей страницы. Он не должен включать элементы, которые повторяются на разных страницах, например, ссылки на навигацию или баннеры. main тег также имеет встроенную ориентирную функцию, которую вспомогательные технологии могут использовать для быстрого перехода к основному контенту. Если вы когда-либо видели ссылку «Перейти к основному содержимому» в верхней части страницы, использование тега main автоматически предоставляет вспомогательные устройства, которые имеют функциональность.

Instructions

Camper Cat имеет несколько больших идей для своей страницы оружия ниндзя. Помогите ему настроить свою разметку, добавив открывающие и закрывающие main-теги между header и footer (из других задач). Пока не оставляйте тег main пустым.

Tests

tests:
  - text: В вашем коде должен быть один <code>main</code> тег.
    testString: 'assert($("main").length == 1, "В вашем коде должен быть один <code>main</code> тег.");'
  - text: <code>main</code> теги должны быть между закрывающем тегом <code>header</code> и открывающим тегом <code>footer</code>.
    testString: 'assert(code.match(/<\/header>\s*?<main>\s*?<\/main>/gi), "<code>main</code> теги должны быть между закрывающем тегом <code>header</code> и открывающим тегом <code>footer</code>.");'

Challenge Seed

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



<footer></footer>

Solution

// solution required

4.3 KiB Raw Blame History Unescape Escape