freeCodeCamp/curriculum/challenges/russian/01-responsive-web-design/basic-html-and-html5/define-the-head-and-body-of...

4.5 KiB
Raw Blame History

id title challengeType videoUrl localeTitle
587d78aa367417b2b2512aec Define the Head and Body of an HTML Document 0 Определение заголовка и тела документа HTML

Description

Вы можете добавить еще один уровень организации в свой HTML-документ в тегах html с элементами head и body . Любая разметка с информацией о Вашей странице будет идти в head метку. Тогда любая метка с содержимым страницы (то, что отображается для пользователя) войдет в тег body . Элементы метаданных, такие как link , meta , title и style , обычно входят в элемент head . Вот пример макета страницы:
<! DOCTYPE html>
<HTML>
<Голова>
<! - элементы метаданных ->
</ HEAD>
<Тело>
<! - содержание страницы ->
</ Body>
</ Html>

Instructions

Отредактируйте разметку, чтобы появилась head и body . Элемент head должен включать только title , а элемент body должен включать только h1 и p .

Tests

tests:
  - text: На странице должен быть только один элемент <code>head</code> .
    testString: 'assert($("head").length == 1, "There should be only one <code>head</code> element on the page.");'
  - text: На странице должен быть только один элемент <code>body</code> .
    testString: 'assert($("body").length == 1, "There should be only one <code>body</code> element on the page.");'
  - text: Элемент <code>head</code> должен быть дочерним элементом <code>html</code> .
    testString: 'assert($("html").children("head").length == 1, "The <code>head</code> element should be a child of the <code>html</code> element.");'
  - text: Элемент <code>body</code> должен быть дочерним элементом <code>html</code> .
    testString: 'assert($("html").children("body").length == 1, "The <code>body</code> element should be a child of the <code>html</code> element.");'
  - text: Элемент <code>head</code> должен обернуть элемент <code>title</code> .
    testString: 'assert(code.match(/<head>\s*?<title>\s*?.*?\s*?<\/title>\s*?<\/head>/gi), "The <code>head</code> element should wrap around the <code>title</code> element.");'
  - text: Элемент <code>body</code> должен обернуть оба элемента <code>h1</code> и <code>p</code> .
    testString: 'assert($("body").children("h1").length == 1 && $("body").children("p").length == 1, "The <code>body</code> element should wrap around both the <code>h1</code> and <code>p</code> elements.");'

Challenge Seed

<!DOCTYPE html>
<html>
  <title>The best page ever</title>

  <h1>The best page ever</h1>
  <p>Cat ipsum dolor sit amet, jump launch to pounce upon little yarn mouse, bare fangs at toy run hide in litter box until treats are fed. Go into a room to decide you didn't want to be in there anyway. I like big cats and i can not lie kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Meow i could pee on this if i had the energy for slap owner's face at 5am until human fills food dish yet scamper. Knock dish off table head butt cant eat out of my own dish scratch the furniture. Make meme, make cute face. Sleep in the bathroom sink chase laser but pee in the shoe. Paw at your fat belly licks your face and eat grass, throw it back up kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

</html>

Solution

// solution required