chore(i18n,learn): processed translations (#45928)

2026-09-24 23:01:18 +08:00 · 2022-05-12 18:20:24 +02:00
parent fadd2b1d13
commit 6bc383f60f
20 changed files with 1564 additions and 3 deletions
@@ -7,7 +7,7 @@ dashedName: step-1

 # --description--

-Come hai imparato negli ultimi passi della App di Foto di Gatto, c'è una struttura di base necessaria per iniziare a costruire la tua pagina web.
+Come hai imparato negli ultimi step di Cat Photo App, c'è una struttura di base necessaria per iniziare a costruire la tua pagina web.

 Aggiungi il tag `<!DOCTYPE html>` e un elemento `html`.

@@ -0,0 +1,61 @@
+---
+id: 5f3313e74582ad9d063e3a38
+title: Step 2
+challengeType: 0
+dashedName: step-2
+---
+
+# --description--
+
+Aggiungi un elemento `head` all'interno dell'elemento `html`, in modo da poter aggiungere un elemento `title`. Il testo dell'elemento `title` dovrebbe essere `Cafe Menu`.
+
+# --hints--
+
+Dovresti avere un tag di apertura `<head>`.
+
+```js
+assert(code.match(/<head>/i));
+```
+
+Dovresti avere un tag di chiusura `</head>`.
+
+```js
+assert(code.match(/<head>/i));
+```
+
+Dovresti avere un tag di apertura `<title>`.
+
+```js
+assert(code.match(/<title>/i));
+```
+
+Dovresti avere un tag di chiusura `</title>`.
+
+```js
+assert(code.match(/<\/title>/i));
+```
+
+L'elemento `title` dovrebbe essere annidato nell'elemento `head`.
+
+```js
+assert(code.match(/<head>\s*<title>.*<\/title>\s*<\/head>/si));
+```
+
+L'elemento `title` dovrebbe avere il testo `Cafe Menu`. Controlla la tua ortografia.
+
+```js
+assert.match(document.querySelector('title')?.innerText, /Cafe Menu/i);
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<!DOCTYPE html>
+<html>
+--fcc-editable-region--
+
+--fcc-editable-region--
+</html>
+```
@@ -0,0 +1,47 @@
+---
+id: 5f331e55dfab7a896e53c3a1
+title: Step 3
+challengeType: 0
+dashedName: step-3
+---
+
+# --description--
+
+`title` è uno dei diversi elementi che forniscono informazioni aggiuntive non visibili sulla pagina web, ma potrebbe essere utile per i motori di ricerca o per la visualizzazione della pagina.
+
+All'interno dell'elemento `head`, annida un elemento `meta` con `utf-8` come valore dell'attributo `charset` per comunicare al browser come codificare i caratteri della pagina. Nota che gli elementi `meta` sono autoconcludenti.
+
+# --hints--
+
+Il codice dovrebbe avere un tag `meta`.
+
+```js
+assert(code.match(/<meta.*?\/?>/is));
+```
+
+Il tag `meta` dovrebbe avere un attributo `charset`.
+
+```js
+assert(code.match(/<meta charset=/i));
+```
+
+L'attributo `charset` dovrebbe avere valore `utf-8`.
+
+```js
+assert(code.match(/charset=('|")utf-8\1/i));
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<!DOCTYPE html>
+<html>
+--fcc-editable-region--
+  <head>
+    <title>Cafe Menu</title>
+  </head>
+--fcc-editable-region--
+<html>
+```
@@ -7,7 +7,7 @@ dashedName: step-4

 # --description--

-Per preparati a creare del contenuto, aggiungi un elemento `body` sotto l'elemento `head`.
+Per prepararti a creare del contenuto, aggiungi un elemento `body` sotto l'elemento `head`.

 # --hints--

@@ -30,7 +30,7 @@ assert(code.match(/<head>/i));
 assert(code.match(/<\/head>/i));
 ```

-Il tuo elemento `body` dovrebbe essere all'interno dell'elemento `head`.
+L'elemento `body` dovrebbe essere all'interno dell'elemento `head`.

 ```js
 assert(code.match(/<\/head>[.\n\s]*<body>/im));
@@ -0,0 +1,60 @@
+---
+id: 5f33294a6af5e9188dbdb8f3
+title: Step 5
+challengeType: 0
+dashedName: step-5
+---
+
+# --description--
+
+Il nome del bar è `CAMPER CAFE`. Aggiungi un elemento `h1` all'interno dell'elemento `body`. Dagli il nome del bar in lettere maiuscole per farlo risaltare.
+
+# --hints--
+
+Dovresti avere un tag di apertura `<h1>`.
+
+```js
+assert(code.match(/<h1>/i));
+```
+
+Dovresti avere un tag di chiusura `</h1>`.
+
+```js
+assert(code.match(/<\/h1>/i));
+```
+
+Non dovresti cambiare l'elemento `body` esistente.
+
+```js
+assert($('body').length === 1);
+```
+
+L'elemento `h1` dovrebbe essere annidato nell'elemento `body`.
+
+```js
+assert($('h1')[0].parentElement.tagName === "BODY");
+```
+
+L'elemento `h1` dovrebbe avere il testo `CAMPER CAFE`.
+
+```js
+assert(code.match(/<h1>CAMPER CAFE<\/h1>/));
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Cafe Menu</title>
+  </head>
+--fcc-editable-region--
+  <body>
+  </body>
+--fcc-editable-region--
+<html>
+```
@@ -0,0 +1,59 @@
+---
+id: 5f332b23c2045fb843337579
+title: Step 7
+challengeType: 0
+dashedName: step-7
+---
+
+# --description--
+
+Dato che l'elemento `p` aggiunto nel passaggio precedente fornisce informazioni supplementari sul bar, annida entrambi gli elementi `h1` e `p` in un elemento `header`.
+
+# --hints--
+
+Dovresti avere un tag di apertura `<header>`.
+
+```js
+assert(code.match(/<header>/i));
+```
+
+Dovresti avere un tag di chiusura `</header>`.
+
+```js
+assert(code.match(/<\/header>/i));
+```
+
+L'elemento `h1` dovrebbe essere annidato nell'elemento `header`.
+
+```js
+const header = document.querySelectorAll('header')[0];
+assert(header.children[0].tagName === 'H1');
+```
+
+L'elemento `p` dovrebbe essere annidato nell'elemento `header`.
+
+```js
+const header = document.querySelectorAll('header')[0];
+assert(header.children[1].tagName === "P");
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Cafe Menu</title>
+  </head>
+  <body>
+--fcc-editable-region--
+    <h1>CAMPER CAFE</h1>
+    <p>Est. 2020</p>
+--fcc-editable-region--
+  </body>
+<html>
+```
+
@@ -0,0 +1,59 @@
+---
+id: 5f33310c1851c6c4da013250
+title: Step 8
+challengeType: 0
+dashedName: step-8
+---
+
+# --description--
+
+È ora di aggiungere qualche contenuto del menu. Aggiungi un elemento `main` al di sotto dell'elemento `header` esistente. Conterrà delle informazioni sui prezzi del caffè e dei dessert offerti dal bar.
+
+# --hints--
+
+Il codice dovrebbe avere un tag di apertura `<main>`.
+
+```js
+assert(code.match(/<main>/i));
+```
+
+Il codice dovrebbe avere un tag di chiusura `</main>`.
+
+```js
+assert(code.match(/<\/main>/i));
+```
+
+Non dovresti cambiare l'elemento `header`. Assicurati di non aver eliminato accidentalmente il tag di chiusura.
+
+```js
+assert($('header').length === 1);
+```
+
+Il tag `main` dovrebbe essere dopo il tag `header`.
+
+```js
+const main = document.querySelectorAll('main')[0];
+assert(main.previousElementSibling.tagName === 'HEADER');
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Cafe Menu</title>
+  </head>
+  <body>
+--fcc-editable-region--
+    <header>
+      <h1>CAMPER CAFE</h1>
+      <p>Est. 2020</p>
+    </header>
+--fcc-editable-region--
+  </body>
+<html>
+```
@@ -0,0 +1,70 @@
+---
+id: 5f344fbc22624a2976425065
+title: Step 10
+challengeType: 0
+dashedName: step-10
+---
+
+# --description--
+
+Crea un elemento `h2` con il testo `Coffee` all'interno dell'elemento `section`.
+
+# --hints--
+
+Dovresti avere un tag di apertura `<h2>`.
+
+```js
+assert(code.match(/<h2\s*>/i));
+```
+
+Dovresti avere un tag di chiusura `</h2>`.
+
+```js
+assert(code.match(/<\/h2\s*>/i));
+```
+
+Non dovresti cambiare l'elemento `section` esistente. Assicurati di non aver eliminato il tag di chiusura.
+
+```js
+assert($('section').length === 1);
+```
+
+L'elemento `h2` dovrebbe essere all'interno dell'elemento `section`.
+
+```js
+const h2 = document.querySelector('h2');
+assert(h2.parentElement.tagName === 'SECTION');
+```
+
+L'elemento `h2` dovrebbe contenere il testo `Coffee`.
+
+```js
+const h2 = document.querySelector('h2');
+assert(h2.innerText === 'Coffee');
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Cafe Menu</title>
+  </head>
+  <body>
+    <header>
+      <h1>CAMPER CAFE</h1>
+      <p>Est. 2020</p>
+    </header>
+    <main>
+--fcc-editable-region--
+      <section>
+      </section>
+--fcc-editable-region--
+    </main>
+  </body>
+<html>
+```
@@ -0,0 +1,61 @@
+---
+id: 5f344fc1520b6719f2e35605
+title: Step 9
+challengeType: 0
+dashedName: step-9
+---
+
+# --description--
+
+Ci saranno due sezioni nel menù, una per il caffè e una per i dessert. Aggiungi un elemento `section` all'interno dell'elemento `main` in modo da avere uno spazio in cui inserire tutti i caffè disponibili.
+
+# --hints--
+
+Dovresti avere un tag di apertura `<section>`.
+
+```js
+assert(code.match(/<section\s*>/i));
+```
+
+Dovresti avere un tag di chiusura `</section>`.
+
+```js
+assert(code.match(/<\/section\s*>/i));
+```
+
+Non dovresti cambiare l'elemento `main` esistente. Assicurati di non aver eliminato il tag di chiusura.
+
+```js
+assert($('main').length === 1);
+```
+
+L'elemento `section` dovrebbe essere all'interno dell'elemento `main`.
+
+```js
+const main = document.querySelectorAll('main')?.[0];
+assert(main.children[0].tagName === 'SECTION');
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Cafe Menu</title>
+  </head>
+  <body>
+    <header>
+      <h1>CAMPER CAFE</h1>
+      <p>Est. 2020</p>
+    </header>
+--fcc-editable-region--
+    <main>
+    </main>
+--fcc-editable-region--
+  </body>
+<html>
+```
@@ -0,0 +1,55 @@
+---
+id: 5dfa2407b521be39a3de7be1
+title: Step 13
+challengeType: 0
+dashedName: step-13
+---
+
+# --description--
+
+Aggiungi un attributo `target` con il valore `_blank` al tag di apertura dell'elemento di ancoraggio (`a`), in modo che il link si apra in una nuova scheda.
+
+# --hints--
+
+L'elemento `p` dovrebbe avere un elemento di ancoraggio annidato (`a`) con il testo `cat photos`. Potresti averlo cancellato o avere un refuso.
+
+```js
+const anchor = $('p > a');
+assert(
+  anchor.length &&
+    anchor[0].innerText.toLowerCase().replace(/\s+/g, ' ') === 'cat photos'
+);
+```
+
+L'elemento di ancoraggio (`a`) non ha un attributo `target`. Verifica che ci sia uno spazio dopo il nome del tag di apertura e/o che ci siano spazi prima di tutti i nomi degli attributi.
+
+```js
+assert(document.querySelector('a').hasAttribute('target'));
+```
+
+Il valore dell'attributo `target` dovrebbe essere `\_blank`. Hai omesso il valore o hai un refuso. Ricorda che i valori degli attributi dovrebbero essere circondati da virgolette.
+
+```js
+assert(document.querySelector('a').getAttribute('target') === '_blank');
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <h2>Cat Photos</h2>
+      <!-- TODO: Add link to cat photos -->
+--fcc-editable-region--
+      <p>Click here to view more <a href="https://freecatphotoapp.com">cat photos</a>.</p>
+--fcc-editable-region--
+      <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
+    </main>
+  </body>
+</html>
+```
+
@@ -0,0 +1,106 @@
+---
+id: 5dfb6a35eacea3f48c6300b4
+title: Step 23
+challengeType: 0
+dashedName: step-23
+---
+
+# --description--
+
+Un elemento di didascalia della figura (`figcaption`) viene usato per aggiungere una didascalia per descrivere l'immagine contenuta nell'elemento `figure`. Ad esempio, `<figcaption>A cute cat</figcaption>` aggiunge la didascalia `A cute cat`.
+
+Dopo l'immagine annidata nell'elemento `figure`, aggiungi un elemento `figcaption` con il testo `Cats love lasagna.`
+
+# --hints--
+
+L'elemento `img` con la lasagna deve essere annidato nell'elemento `figure`.
+
+```js
+assert(
+  document.querySelector('figure > img') &&
+    document.querySelector('figure > img').getAttribute('src').toLowerCase() ===
+      'https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg'
+);
+```
+
+L'elemento `figcaption` dovrebbe avere un tag di apertura. I tag di apertura hanno la seguente sintassi: `<nomeElemento>`.
+
+```js
+assert(document.querySelector('figcaption'));
+```
+
+L'elemento `figcaption` dovrebbe avere un tag di chiusura. I tag di chiusura hanno un carattere `/` subito dopo il carattere `<`.
+
+```js
+assert(code.match(/<\/figcaption\>/));
+```
+
+L'elemento `figcaption` dovrebbe essere annidato nell'elemento `figure`.
+
+```js
+assert(
+  document.querySelector('figure > figcaption') &&
+    document.querySelector('figure > figcaption')
+);
+```
+
+L’elemento `img` con la lasagna dovrebbe essere annidato nell’elemento `figure`.
+
+```js
+assert(
+  document.querySelector('figure > img') &&
+    document.querySelector('figure > img').getAttribute('src').toLowerCase() ===
+      'https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg'
+);
+```
+
+L'elemento `figcaption` annidato nell'elemento `figure` dovrebbe essere sotto l'elemento `img`. Sono nell'ordine sbagliato.
+
+```js
+assert(
+  document.querySelector('figcaption').previousElementSibling.nodeName === 'IMG'
+);
+```
+
+Il testo dell'elemento `figcaption` dovrebbe essere `Cats love lasagna.` Hai omesso il testo o hai un refuso.
+
+```js
+assert(
+  document.querySelector('figcaption').innerText.match(/Cats love lasagna.?$/i)
+);
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+--fcc-editable-region--
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+        </figure>
+--fcc-editable-region--
+      </section>
+    </main>
+  </body>
+</html>
+```
+
@@ -0,0 +1,79 @@
+---
+id: 5ef9b03c81a63668521804d1
+title: Step 25
+challengeType: 0
+dashedName: step-25
+---
+
+# --description--
+
+Dopo l'elemento `figure`, aggiungi un altro elemento `h3` con il testo `Top 3 things cats hate:`.
+
+# --hints--
+
+Ci dovrebbe essere un elemento `h3` proprio sopra il tag di chiusura del secondo elemento `section`. Assicurati che ci siano un tag di apertura e uno di chiusura.
+
+```js
+assert(
+  document.querySelectorAll('main > section')[1].lastElementChild.nodeName ===
+    'H3' && code.match(/<\/h3\>/g).length === 2
+);
+```
+
+Il nuovo elemento `h3` dovrebbe contenere il testo `Top 3 things cats hate:`. Assicurati di includere i due punti alla fine del testo.
+
+```js
+assert(
+  document
+    .querySelectorAll('main > section')[1]
+    .lastElementChild.innerText.toLowerCase()
+    .replace(/\s+/g, ' ') === 'top 3 things cats hate:'
+);
+```
+
+Dovrebbe esserci un elemento `figure` sopra il nuovo elemento `h3`. Potresti aver cancellato accidentalmente l'elemento `figure`.
+
+```js
+const secondSectionLastElemNode = document.querySelectorAll('main > section')[1]
+  .lastElementChild;
+assert(
+  secondSectionLastElemNode.nodeName === 'H3' &&
+    secondSectionLastElemNode.previousElementSibling.nodeName === 'FIGURE'
+);
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+--fcc-editable-region--
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+--fcc-editable-region--
+      </section>
+    </main>
+  </body>
+</html>
+```
+
@@ -0,0 +1,103 @@
+---
+id: 5ef9b03c81a63668521804d5
+title: Step 33
+challengeType: 0
+dashedName: step-33
+---
+
+# --description--
+
+All'interno del terzo elemento `section`, aggiungi un elemento `h2` con il testo `Cat Form`.
+
+# --hints--
+
+Non è possibile trovare il terzo elemento `section`. Potresti aver cancellato accidentalmente l'elemento o il tag di apertura o di chiusura.
+
+```js
+assert(
+  document.querySelectorAll('section').length === 3 &&
+    code.match(/<\/section>/g).length === 3
+);
+```
+
+L'elemento `h2` dovrebbe avere un tag di apertura e un tag di chiusura. Potrebbero mancare uno o entrambi i tag richiesti.
+
+```js
+assert(
+  document.querySelectorAll('h2').length >= 3 &&
+    code.match(/<\/h2>/g).length >= 3
+);
+```
+
+Dovresti aggiungere solo un elemento `h2`. Rimuovi quelli di troppo.
+
+```js
+assert(document.querySelectorAll('h2').length === 3);
+```
+
+Il nuovo elemento `h2` dovrebbe essere posizionato proprio sopra il tag di chiusura del terzo elemento `section`.
+
+```js
+const thirdSection = document.querySelectorAll('section')[2];
+assert(thirdSection.lastElementChild.nodeName === 'H2');
+```
+
+Il testo dell'lemento `h2` dovrebbe essere `Cat Form`.
+
+```js
+const thirdSection = document.querySelectorAll('section')[2];
+assert(
+  thirdSection
+    .querySelector('h2')
+    .innerText.toLowerCase()
+    .replace(/\s+/g, ' ') === 'cat form'
+);
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>
+        </figure>
+      </section>
+--fcc-editable-region--
+      <section>
+      </section>
+--fcc-editable-region--
+    </main>
+  </body>
+</html>
+```
+
@@ -0,0 +1,93 @@
+---
+id: 5ef9b03c81a63668521804da
+title: Step 41
+challengeType: 0
+dashedName: step-41
+---
+
+# --description--
+
+Utilizza l'elemento `button` per creare un pulsante su cui poter cliccare. Ad esempio, `<button>Click Here</button>` crea un pulsante con il testo `Click Here`.
+
+Aggiungi un elemento `button` con il testo `Submit` sotto l'elemento `input`. In seguito a un click su un pulsante modulo senza alcun attributo, il modulo viene inviato di default alla posizione specificata nell'attributo `action` del modulo.
+
+# --hints--
+
+L'elemento `button` dovrebbe avere un tag di apertura. I tag di apertura hanno questa sintassi: `<nomeElemento>`.
+
+```js
+assert(document.querySelector('button'));
+```
+
+L'elemento `button` dovrebbe avere un tag di chiusura. I tag di chiusura hanno un carattere `/` subito dopo il carattere `<`.
+
+```js
+assert(code.match(/<\/button\>/));
+```
+
+Il testo dell'elemento `button` dovrebbe essere `Submit`. Hai omesso il testo o hai un refuso.
+
+```js
+assert(document.querySelector('button').innerText.toLowerCase() === 'submit');
+```
+
+L'elemento `button` dovrebbe essere sotto l'elemento `input`. Sono nell'ordine sbagliato.
+
+```js
+const collection = [...document.querySelectorAll('input, button')].map(
+  (node) => node.nodeName
+);
+assert(collection.indexOf('INPUT') < collection.indexOf('BUTTON'));
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
+        </figure>
+      </section>
+      <section>
+        <h2>Cat Form</h2>
+        <form action="https://freecatphotoapp.com/submit-cat-photo">
+--fcc-editable-region--
+          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
+--fcc-editable-region--
+        </form>
+      </section>
+    </main>
+  </body>
+</html>
+```
+
@@ -0,0 +1,118 @@
+---
+id: 5ef9b03c81a63668521804e9
+title: Step 63
+challengeType: 0
+dashedName: step-63
+---
+
+# --description--
+
+Rendi il testo `freeCodeCamp.org` un link racchiudendolo in un elemento di ancoraggio (`a`). L'attributo `href` dovrebbe avere valore `https://www.freecodecamp.org`.
+
+# --hints--
+
+L'elemento di ancoraggio (`a`) dovrebbe essere annidato all'interno dell'elemento `footer`. Assicurati di aggiungere un tag di apertura e di chiusura per l'elemento di ancoraggio (`a`).
+
+```js
+assert($('footer > p > a').length);
+```
+
+L'elemento di ancoraggio (`a`) dovrebbe avere un tag di chiusura. I tag di chiusura hanno un carattere `/` subito dopo il carattere `<`.
+
+```js
+const aElemClosingTags = code.match(/<\/a\>/g);
+assert(aElemClosingTags && aElemClosingTags.length === 3);
+```
+
+L'elemento di ancoraggio (`a`) dovrebbe avere un attributo `href` con il valore `https://www.freecodecamp.org`. Potresti aver omesso l'attributo o il valore o avere un refuso.
+
+```js
+const nestedAnchor = $('footer > p > a')[0];
+assert(nestedAnchor.getAttribute('href') === 'https://www.freecodecamp.org');
+```
+
+Il testo del link dovrebbe essere `freeCodeCamp.org`. Hai omesso il testo o hai un refuso.
+
+```js
+const nestedAnchor = $('footer > p > a')[0];
+assert(
+  nestedAnchor.innerText.toLowerCase().replace(/\s+/g, ' ') ===
+    'freecodecamp.org'
+);
+```
+
+Dopo aver annidato l'elemento di ancoraggio (`a`), il solo contenuto dell'elemento `p` visibile nel browser dovrebbe essere `No Copyright - freeCodeCamp.org`. Controlla il testo, la spaziatura o la punteggiatura sia dell'elemento `p` che dell'elemento di ancoraggio annidato.
+
+```js
+const pText = $('footer > p')[0].innerText.toLowerCase().replace(/\s+/g, ' ');
+assert(pText.match(/^no copyright - freecodecamp.org$/));
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
+        </figure>
+      </section>
+      <section>
+        <h2>Cat Form</h2>
+        <form action="https://freecatphotoapp.com/submit-cat-photo">
+          <fieldset>
+            <legend>Is your cat an indoor or outdoor cat?</legend>
+            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
+            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
+          </fieldset>
+          <fieldset>
+            <legend>What's your cat's personality?</legend>
+            <input id="loving" type="checkbox" name="personality" value="loving" checked> <label for="loving">Loving</label>
+            <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label>
+            <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic">Energetic</label>
+          </fieldset>
+          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
+          <button type="submit">Submit</button>
+        </form>
+      </section>
+    </main>
+    <footer>
+      <p>
+--fcc-editable-region--
+        No Copyright - freeCodeCamp.org
+--fcc-editable-region--
+      </p>
+    </footer>
+  </body>
+</html>
+```
+
@@ -0,0 +1,108 @@
+---
+id: 5ef9b03c81a63668521804ea
+title: Step 64
+challengeType: 0
+dashedName: step-64
+---
+
+# --description--
+
+Nota che tutto ciò che hai aggiunto alla pagina finora è all'interno dell'elemento `body`. Tutti i contenuti che devono essere visualizzati nella pagina devono trovarsi all'interno dell'elemento `body`. Tuttavia, altre informazioni importanti vanno all'interno dell'elemento `head`.
+
+Aggiungi un elemento `head` appena sopra l'elemento `body`.
+
+# --hints--
+
+Hai eliminato l'elemento `body` oppure manca un tag di apertura o di chiusura.
+
+```js
+assert(document.querySelector('body') && code.match(/<\/body>/));
+```
+
+L'elemento `head` dovrebbe avere un tag di apertura. I tag di apertura hanno la seguente sintassi: `<nomeElemento>`.
+
+```js
+assert(code.match(/\<head\>/));
+```
+
+L'elemento `head` dovrebbe avere un tag di chiusura. I tag di chiusura hanno un carattere `/` subito dopo il carattere `<`.
+
+```js
+assert(code.match(/\<\/head\>/));
+```
+
+L'elemento `head` dovrebbe essere al di sopra del tag di apertura dell'elemento `body`. Lo hai inserito nel posto sbagliato.
+
+```js
+const noSpaces = code.replace(/\s/g, '');
+assert(noSpaces.match(/\<\/head\>\<body\>/));
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+--fcc-editable-region--
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
+        </figure>
+      </section>
+      <section>
+        <h2>Cat Form</h2>
+        <form action="https://freecatphotoapp.com/submit-cat-photo">
+          <fieldset>
+            <legend>Is your cat an indoor or outdoor cat?</legend>
+            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
+            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
+          </fieldset>
+          <fieldset>
+            <legend>What's your cat's personality?</legend>
+            <input id="loving" type="checkbox" name="personality" value="loving" checked> <label for="loving">Loving</label>
+            <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label>
+            <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic">Energetic</label>
+          </fieldset>
+          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
+          <button type="submit">Submit</button>
+        </form>
+      </section>
+    </main>
+    <footer>
+      <p>
+        No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a>
+      </p>
+    </footer>
+  </body>
+--fcc-editable-region--
+</html>
+```
+
@@ -0,0 +1,110 @@
+---
+id: 5ef9b03c81a63668521804eb
+title: Step 65
+challengeType: 0
+dashedName: step-65
+---
+
+# --description--
+
+L'elemento `title` determina ciò che il browser mostra nella barra del titolo o nella scheda della pagina.
+
+Aggiungi un elemento `title` all'interno dell'elemento `head`. Dovrebbe contenere il testo `CatPhotoApp`.
+
+# --hints--
+
+Hai eliminato l'elemento `head` oppure manca un tag di apertura o chiusura.
+
+```js
+assert(code.match(/\<head\>/) && code.match(/\<\/head\>/));
+```
+
+L'elemento `title` dovrebbe essere annidato nell'elemento `head`. Assicurati di aggiungere i tag di apertura e chiusura dell'elemento `title`.
+
+```js
+const noSpaces = code.replace(/\s/g, '');
+assert(noSpaces.match(/\<head\>\<title\>.*\<\/title\>\<\/head\>/));
+```
+
+L'elemento `title` dovrebbe avere un tag di chiusura. I tag di chiusura hanno un carattere `/` appena dopo il carattere `<`.
+
+```js
+assert(code.match(/\<\/title\>/));
+```
+
+Il testo dell'elemento `title` dovrebbe essere `CatPhotoApp`. Hai omesso il testo o hai un refuso.
+
+```js
+assert(document.title && document.title.toLowerCase() === 'catphotoapp');
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+--fcc-editable-region--
+  <head>
+  </head>
+--fcc-editable-region--
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
+        </figure>
+      </section>
+      <section>
+        <h2>Cat Form</h2>
+        <form action="https://freecatphotoapp.com/submit-cat-photo">
+          <fieldset>
+            <legend>Is your cat an indoor or outdoor cat?</legend>
+            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
+            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
+          </fieldset>
+          <fieldset>
+            <legend>What's your cat's personality?</legend>
+            <input id="loving" type="checkbox" name="personality" value="loving" checked> <label for="loving">Loving</label>
+            <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label>
+            <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic">Energetic</label>
+          </fieldset>
+          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
+          <button type="submit">Submit</button>
+        </form>
+      </section>
+    </main>
+    <footer>
+      <p>
+        No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a>
+      </p>
+    </footer>
+  </body>
+</html>
+```
+
@@ -0,0 +1,105 @@
+---
+id: 5ef9b03c81a63668521804ec
+title: Step 66
+challengeType: 0
+dashedName: step-66
+---
+
+# --description--
+
+Nota che l'intero contenuto della pagina è annidato all'interno di un elemento `html`. Tutti gli altri elementi devono essere discendenti di questo elemento `html`.
+
+Aggiungi l'attributo `lang` con il valore `en` al tag di apertura `html` per specificare che la lingua della pagina è l'inglese.
+
+# --hints--
+
+Hai eliminato l'elemento `html` oppure manca un tag di apertura o di chiusura.
+
+```js
+assert(code.match(/\<html.*?\>/) && code.match(/\<\/html\>/));
+```
+
+L'elemento `html` dovrebbe avere un attributo `lang` con il valore `en`. Potresti aver omesso l'attributo o il valore o avere un refuso.
+
+```js
+const extraSpacesRemoved = code.replace(/\s+/g, ' ');
+assert(extraSpacesRemoved.match(/\<html lang\=("|')([a-z]+)\1\>/));
+```
+
+Anche se hai impostato `en` come valore dell'attributo `lang` dell'elemento `html`, è raccomandato inserire sempre il valore di un attributo tra virgolette.
+
+```js
+assert(!/\<\s*html\s+lang\s*=en/i.test(code));
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+--fcc-editable-region--
+<html>
+--fcc-editable-region--
+  <head>
+    <title>CatPhotoApp</title>
+  </head>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
+        </figure>
+      </section>
+      <section>
+        <h2>Cat Form</h2>
+        <form action="https://freecatphotoapp.com/submit-cat-photo">
+          <fieldset>
+            <legend>Is your cat an indoor or outdoor cat?</legend>
+            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
+            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
+          </fieldset>
+          <fieldset>
+            <legend>What's your cat's personality?</legend>
+            <input id="loving" type="checkbox" name="personality" value="loving" checked> <label for="loving">Loving</label>
+            <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label>
+            <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic">Energetic</label>
+          </fieldset>
+          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
+          <button type="submit">Submit</button>
+        </form>
+      </section>
+    </main>
+    <footer>
+      <p>
+        No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a>
+      </p>
+    </footer>
+  </body>
+</html>
+```
+
@@ -0,0 +1,166 @@
+---
+id: 5ef9b03c81a63668521804ee
+title: Step 67
+challengeType: 0
+dashedName: step-67
+---
+
+# --description--
+
+Tutte le pagine dovrebbero iniziare con `<!DOCTYPE html>`. Questa stringa speciale viene detta <dfn>dichiarazione</dfn> e garantisce che il browser cerchi di soddisfare le specifiche del settore.
+
+Per completare questo progetto, aggiungi questa dichiarazione come prima riga del codice.
+
+# --hints--
+
+Il tuo codice dovrebbe iniziare con la dichiarazione `<!DOCTYPE html>`. Potresti aver omesso la dichiarazione, non averla inserita come prima riga di codice o avere un refuso.
+
+```js
+assert(code.match(/\<\s*!DOCTYPE\s+html\s*\>/));
+```
+
+`<!DOCTYPE html>` deve essere situato nella parte superiore del documento.
+
+```js
+const noSpaces = code.replace(/\s/g, '');
+assert(noSpaces.match(/^\<\!DOCTYPEhtml\>\<html/));
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+--fcc-editable-region--
+<html lang="en">
+  <head>
+    <title>CatPhotoApp</title>
+  </head>
+--fcc-editable-region--
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
+        </figure>
+      </section>
+      <section>
+        <h2>Cat Form</h2>
+        <form action="https://freecatphotoapp.com/submit-cat-photo">
+          <fieldset>
+            <legend>Is your cat an indoor or outdoor cat?</legend>
+            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
+            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
+          </fieldset>
+          <fieldset>
+            <legend>What's your cat's personality?</legend>
+            <input id="loving" type="checkbox" name="personality" value="loving" checked> <label for="loving">Loving</label>
+            <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label>
+            <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic">Energetic</label>
+          </fieldset>
+          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
+          <button type="submit">Submit</button>
+        </form>
+      </section>
+    </main>
+    <footer>
+      <p>
+        No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a>
+      </p>
+    </footer>
+  </body>
+</html>
+```
+
+# --solutions--
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>CatPhotoApp</title>
+  </head>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
+        </figure>
+      </section>
+      <section>
+        <h2>Cat Form</h2>
+        <form action="https://freecatphotoapp.com/submit-cat-photo">
+          <fieldset>
+            <legend>Is your cat an indoor or outdoor cat?</legend>
+            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
+            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
+          </fieldset>
+          <fieldset>
+            <legend>What's your cat's personality?</legend>
+            <label for="loving"><input id="loving" type="checkbox" name="personality" value="loving" checked> Loving</label>
+            <label for="lazy"><input id="lazy" type="checkbox" name="personality" value="lazy"> Lazy</label>
+            <label for="energetic"><input id="energetic" type="checkbox" name="personality" value="energetic"> Energetic</label>
+          </fieldset>
+          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
+          <button type="submit">Submit</button>
+        </form>
+      </section>
+    </main>
+    <footer>
+      <p>
+        No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a>
+      </p>
+    </footer>
+  </body>
+</html>
+```
@@ -0,0 +1,101 @@
+---
+id: 5efb2c990dc218d6c85f89b2
+title: Step 42
+challengeType: 0
+dashedName: step-42
+---
+
+# --description--
+
+Anche se hai aggiunto il pulsante sotto l'input di testo, appaiono uno accanto all'altro sulla pagina. Questo perché entrambi gli elementi `input` e `button` sono <dfn>inline elements</dfn>, che non appaiono su nuove righe.
+
+Precedentemente, hai imparato che il pulsante invia il modulo di default, ma puoi aggiungere esplicitamente l'attributo `type` con il valore `submit` per renderlo più chiaro. Prosegui in questo modo per specificare dove il pulsante dovrebbe inviare il modulo.
+
+# --hints--
+
+L'elemento `button` dovrebbe avere un tag di apertura. I tag di apertura hanno questa sintassi: `<nomeElemento>`.
+
+```js
+assert(document.querySelector('button'));
+```
+
+L'elemento `button` dovrebbe avere un tag di chiusura. I tag di chiusura hanno un carattere `/` subito dopo il carattere `<`.
+
+```js
+assert(code.match(/<\/button\>/));
+```
+
+L'elemento `button` non ha un attributo `type`. Controlla che ci sia uno spazio dopo il nome del tag di apertura.
+
+```js
+assert($('button')[0].hasAttribute('type'));
+```
+
+L'elemento `button` dovrebbe avere un attributo `type` con il valore `submit`. Hai omesso il valore o hai un refuso. Ricorda che i valori degli attributi devono essere circondati da virgolette.
+
+```js
+assert(
+  $('button')[0]
+    .getAttribute('type')
+    .match(/^submit$/i)
+);
+```
+
+Anche se hai impostato `submit` come valore dell'attributo `type` dell'elemento `button`, è raccomandato inserire sempre il valore di un attributo tra virgolette.
+
+```js
+assert(!/\<\s*button\s+type\s*=\s*submit/i.test(code));
+```
+
+# --seed--
+
+## --seed-contents--
+
+```html
+<html>
+  <body>
+    <h1>CatPhotoApp</h1>
+    <main>
+      <section>
+        <h2>Cat Photos</h2>
+        <!-- TODO: Add link to cat photos -->
+        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
+        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
+      </section>
+      <section>
+        <h2>Cat Lists</h2>
+        <h3>Things cats love:</h3>
+        <ul>
+          <li>cat nip</li>
+          <li>laser pointers</li>
+          <li>lasagna</li>
+        </ul>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
+          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
+        </figure>
+        <h3>Top 3 things cats hate:</h3>
+        <ol>
+          <li>flea treatment</li>
+          <li>thunder</li>
+          <li>other cats</li>
+        </ol>
+        <figure>
+          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
+          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
+        </figure>
+      </section>
+      <section>
+        <h2>Cat Form</h2>
+        <form action="https://freecatphotoapp.com/submit-cat-photo">
+          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
+--fcc-editable-region--
+          <button>Submit</button>
+--fcc-editable-region--
+        </form>
+      </section>
+    </main>
+  </body>
+</html>
+```
+