freeCodeCamp

4.0 KiB

Raw Blame History

id	title	challengeType	videoUrl	localeTitle
587d78aa367417b2b2512aec	Define the Head and Body of an HTML Document	0		Definir la cabeza y el cuerpo de un documento HTML

Description

Puede agregar otro nivel de organización en su documento HTML dentro de las etiquetas html con los elementos de head y body . Cualquier marca con información sobre su página irá a la etiqueta de head . Luego, cualquier marca con el contenido de la página (lo que se muestra para un usuario) se colocará en la etiqueta del body . Los elementos de metadatos, como link , meta , title y style , por lo general van dentro de la head del elemento. Aquí hay un ejemplo del diseño de una página:

<! DOCTYPE html>
<html>
<head>
<! - Elementos de metadatos ->
</head>
<body>
<! - contenidos de la página ->
</body>
</html>

Instructions

Edite el marcado para que haya una head y un body . La head elemento sólo debe incluir el title , y el body elemento sólo debe incluir la h1 y p .

Tests

tests:
  - text: Solo debe haber un elemento de <code>head</code> en la página.
    testString: 'assert($("head").length == 1, "There should be only one <code>head</code> element on the page.");'
  - text: Solo debe haber un elemento de <code>body</code> en la página.
    testString: 'assert($("body").length == 1, "There should be only one <code>body</code> element on the page.");'
  - text: La <code>head</code> elemento debe ser un hijo de la <code>html</code> elemento.
    testString: 'assert($("html").children("head").length == 1, "The <code>head</code> element should be a child of the <code>html</code> element.");'
  - text: El elemento del <code>body</code> debe ser un elemento secundario del elemento <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: La <code>head</code> elemento debe envolver el <code>title</code> del elemento.
    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: El elemento del <code>body</code> debe envolver alrededor de los elementos <code>h1</code> y <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

4.0 KiB Raw Blame History