2020-07-24 16:13:46 +00:00
---
id: 5ef9b03c81a63668521804ee
title: Part 67
challengeType: 0
2021-01-13 02:31:00 +00:00
dashedName: part-67
2020-07-24 16:13:46 +00:00
---
2020-11-27 18:02:05 +00:00
# --description--
2020-07-24 16:13:46 +00:00
All pages should begin with `<!DOCTYPE html>` . This special string is known as a < dfn > declaration</ dfn > and ensures the browser tries to meet industry-wide specifications.
To complete this project, add this declaration as the first line of the code.
2020-11-27 18:02:05 +00:00
# --hints--
2020-07-24 16:13:46 +00:00
2020-11-27 18:02:05 +00:00
Your code should begin with the declaration `<!DOCTYPE html>` . You may have omitted the declaration, have a typo, or it is not the first line of code.
2020-07-24 16:13:46 +00:00
2020-11-27 18:02:05 +00:00
```js
assert(code.match(/\<\s*!DOCTYPE\s+html\s*\>/));
```
Your `<!DOCTYPE html>` must be located at the top of the document.
2020-07-24 16:13:46 +00:00
2020-11-27 18:02:05 +00:00
```js
const noSpaces = code.replace(/\s/g, '');
assert(noSpaces.match(/^\<\!DOCTYPEhtml\>\<html/));
2020-07-24 16:13:46 +00:00
```
2020-11-27 18:02:05 +00:00
# --seed--
2020-07-24 16:13:46 +00:00
2020-11-27 18:02:05 +00:00
## --seed-contents--
2020-07-24 16:13:46 +00:00
```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 -->
2020-07-25 06:16:42 +00:00
< 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://bit.ly/fcc-relaxing-cat" alt = "A cute orange cat lying on its back." > < / a >
2020-07-24 16:13:46 +00:00
< / 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://bit.ly/fcc-lasagna" 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://bit.ly/fcc-cats" 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 >
```
2020-11-27 18:02:05 +00:00
# --solutions--
2020-07-24 16:13:46 +00:00
```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 -->
2020-07-25 06:16:42 +00:00
< 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://bit.ly/fcc-relaxing-cat" alt = "A cute orange cat lying on its back." > < / a >
2020-07-24 16:13:46 +00:00
< / 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://bit.ly/fcc-lasagna" 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://bit.ly/fcc-cats" 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 >
```