gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(curriculum): HTML-challenges: links are inconsistent. (#41900)

Browse Source 
Co-authored-by: Ilenia <nethleen@gmail.com>
This commit is contained in:
EboranBokaj
2021-04-26 19:04:53 +02:00
committed by GitHub
parent 6f744e063e
commit e45689d495
18 changed files with 67 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form.md
View File

@ -64,7 +64,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -78,7 +78,7 @@ assert(
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL"> <input type="text" placeholder="cat photo URL">
</form> </form>
</main> </main>
@ -91,7 +91,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -105,7 +105,7 @@ assert(
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL"> <input type="text" placeholder="cat photo URL">
<button type="submit">Submit</button> <button type="submit">Submit</button>
</form> </form>

6
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/add-images-to-your-website.md
View File

@ -37,7 +37,7 @@ Let's try to add an image to our website:
Within the existing `main` element, insert an `img` element before the existing `p` elements. Within the existing `main` element, insert an `img` element before the existing `p` elements.
Now set the `src` attribute so that it points to the url `https://bit.ly/fcc-relaxing-cat` Now set the `src` attribute so that it points to the url `https://www.bit.ly/fcc-relaxing-cat`
Finally, don't forget to give your `img` element an `alt` attribute with applicable text. Finally, don't forget to give your `img` element an `alt` attribute with applicable text.
@ -52,7 +52,7 @@ assert($('img').length);
Your image should have a `src` attribute that points to the kitten image. Your image should have a `src` attribute that points to the kitten image.
```js ```js
assert(/^https:\/\/bit\.ly\/fcc-relaxing-cat$/i.test($('img').attr('src'))); assert(/^https:\/\/www\.bit\.ly\/fcc-relaxing-cat$/i.test($('img').attr('src')));
``` ```
Your image element's `alt` attribute should not be empty. Your image element's `alt` attribute should not be empty.
@ -86,7 +86,7 @@ assert(
```html ```html
<h2>CatPhotoApp</h2> <h2>CatPhotoApp</h2>
<main> <main>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
</main> </main>

4
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field.md
View File

@ -64,7 +64,7 @@ assert($('input[type=text]').length > 0);
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -89,7 +89,7 @@ assert($('input[type=text]').length > 0);
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>

8
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default.md
View File

@ -44,7 +44,7 @@ assert($('input[type="checkbox"]').prop('checked'));
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -58,7 +58,7 @@ assert($('input[type="checkbox"]').prop('checked'));
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor"> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor"> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br>
<label for="loving"><input id="loving" type="checkbox" name="personality" value="loving"> Loving</label> <label for="loving"><input id="loving" type="checkbox" name="personality" value="loving"> Loving</label>
@ -77,7 +77,7 @@ assert($('input[type="checkbox"]').prop('checked'));
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -91,7 +91,7 @@ assert($('input[type="checkbox"]').prop('checked'));
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br>
<label for="loving"><input id="loving" type="checkbox" name="personality" value="loving" checked> Loving</label> <label for="loving"><input id="loving" type="checkbox" name="personality" value="loving" checked> Loving</label>

4
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list.md
View File

@ -77,7 +77,7 @@ assert($('ul li').filter((_, item) => !$(item).text().trim()).length === 0);
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
@ -91,7 +91,7 @@ assert($('ul li').filter((_, item) => !$(item).text().trim()).length === 0);
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<ul> <ul>
<li>milk</li> <li>milk</li>

12
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/create-a-form-element.md
View File

@ -20,7 +20,7 @@ For example:
# --instructions-- # --instructions--
Nest the existing `input` element inside a `form` element and assign `"https://freecatphotoapp.com/submit-cat-photo"` to the `action` attribute of the `form` element. Nest the existing `input` element inside a `form` element and assign `"https://www.freecatphotoapp.com/submit-cat-photo"` to the `action` attribute of the `form` element.
# --hints-- # --hints--
@ -34,11 +34,11 @@ assert(
); );
``` ```
Your `form` should have an `action` attribute which is set to `https://freecatphotoapp.com/submit-cat-photo` Your `form` should have an `action` attribute which is set to `https://www.freecatphotoapp.com/submit-cat-photo`
```js ```js
assert( assert(
$('form').attr('action') === 'https://freecatphotoapp.com/submit-cat-photo' $('form').attr('action') === 'https://www.freecatphotoapp.com/submit-cat-photo'
); );
``` ```
@ -61,7 +61,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -86,7 +86,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -100,7 +100,7 @@ assert(
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL"> <input type="text" placeholder="cat photo URL">
</form> </form>
</main> </main>

8
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes.md
View File

@ -76,7 +76,7 @@ assert($('label').parent().get(0).tagName.match('FORM'));
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -90,7 +90,7 @@ assert($('label').parent().get(0).tagName.match('FORM'));
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor"> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor"> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor"> Outdoor</label><br>
<input type="text" placeholder="cat photo URL" required> <input type="text" placeholder="cat photo URL" required>
@ -106,7 +106,7 @@ assert($('label').parent().get(0).tagName.match('FORM'));
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -120,7 +120,7 @@ assert($('label').parent().get(0).tagName.match('FORM'));
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor"> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor"> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor"> Outdoor</label><br>
<label for="playful"><input id="playful" type="checkbox" name="personality">Playful</label> <label for="playful"><input id="playful" type="checkbox" name="personality">Playful</label>

8
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons.md
View File

@ -108,7 +108,7 @@ assert($('label').parent().get(0).tagName.match('FORM'));
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -122,7 +122,7 @@ assert($('label').parent().get(0).tagName.match('FORM'));
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL" required> <input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button> <button type="submit">Submit</button>
</form> </form>
@ -136,7 +136,7 @@ assert($('label').parent().get(0).tagName.match('FORM'));
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -150,7 +150,7 @@ assert($('label').parent().get(0).tagName.match('FORM'));
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor"> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor"> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor"> Outdoor</label><br>
<input type="text" placeholder="cat photo URL" required> <input type="text" placeholder="cat photo URL" required>

4
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/create-a-text-field.md
View File

@ -42,7 +42,7 @@ assert($('input[type=text]').length > 0);
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -68,7 +68,7 @@ assert($('input[type=text]').length > 0);
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>

4
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/create-an-ordered-list.md
View File

@ -119,7 +119,7 @@ $('ol li').each((i, val) =>
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -139,7 +139,7 @@ $('ol li').each((i, val) =>
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>

14
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements.md
View File

@ -14,14 +14,14 @@ You can use `a` (*anchor*) elements to link to content outside of your web page.
`a` elements need a destination web address called an `href` attribute. They also need anchor text. Here's an example: `a` elements need a destination web address called an `href` attribute. They also need anchor text. Here's an example:
```html ```html
<a href="https://freecodecamp.org">this links to freecodecamp.org</a> <a href="https://www.freecodecamp.org">this links to freecodecamp.org</a>
``` ```
Then your browser will display the text `this links to freecodecamp.org` as a link you can click. And that link will take you to the web address `https://www.freecodecamp.org`. Then your browser will display the text `this links to freecodecamp.org` as a link you can click. And that link will take you to the web address `https://www.freecodecamp.org`.
# --instructions-- # --instructions--
Create an `a` element that links to `https://freecatphotoapp.com` and has "cat photos" as its anchor text. Create an `a` element that links to `https://www.freecatphotoapp.com` and has "cat photos" as its anchor text.
# --hints-- # --hints--
@ -31,10 +31,10 @@ Your `a` element should have the anchor text of `cat photos`.
assert(/cat photos/gi.test($('a').text())); assert(/cat photos/gi.test($('a').text()));
``` ```
You need an `a` element that links to `https://freecatphotoapp.com` You need an `a` element that links to `https://www.freecatphotoapp.com`
```js ```js
assert(/^https?:\/\/freecatphotoapp\.com\/?$/i.test($('a').attr('href'))); assert(/^https?:\/\/www\.freecatphotoapp\.com\/?$/i.test($('a').attr('href')));
``` ```
Your `a` element should have a closing tag. Your `a` element should have a closing tag.
@ -56,7 +56,7 @@ assert(
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
@ -69,9 +69,9 @@ assert(
<h2>CatPhotoApp</h2> <h2>CatPhotoApp</h2>
<main> <main>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<a href="https://freecatphotoapp.com">cat photos</a> <a href="https://www.freecatphotoapp.com">cat photos</a>
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
</main> </main>

6
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements.md
View File

@ -85,9 +85,9 @@ assert($('footer').eq(0).attr('id') == 'footer');
<h2>CatPhotoApp</h2> <h2>CatPhotoApp</h2>
<main> <main>
<a href="https://freecatphotoapp.com" target="_blank">cat photos</a> <a href="https://www.freecatphotoapp.com" target="_blank">cat photos</a>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. 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> <p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. 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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
@ -107,7 +107,7 @@ assert($('footer').eq(0).attr('id') == 'footer');
<a href="#footer">Jump to Bottom</a> <a href="#footer">Jump to Bottom</a>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. 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> <p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. 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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

8
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol.md
View File

@ -15,7 +15,7 @@ This is also handy when you're changing the behavior of a link using `JavaScript
# --instructions-- # --instructions--
The current value of the `href` attribute is a link that points to "`https://freecatphotoapp.com`". Replace the `href` attribute value with a `#`, also known as a hash symbol, to create a dead link. The current value of the `href` attribute is a link that points to "`https://www.freecatphotoapp.com`". Replace the `href` attribute value with a `#`, also known as a hash symbol, to create a dead link.
For example: `href="#"` For example: `href="#"`
@ -34,9 +34,9 @@ assert($('a').attr('href') === '#');
```html ```html
<h2>CatPhotoApp</h2> <h2>CatPhotoApp</h2>
<main> <main>
<p>Click here to view more <a href="https://freecatphotoapp.com" target="_blank">cat photos</a>.</p> <p>Click here to view more <a href="https://www.freecatphotoapp.com" target="_blank">cat photos</a>.</p>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
@ -50,7 +50,7 @@ assert($('a').attr('href') === '#');
<main> <main>
<p>Click here to view more <a href="#" target="_blank">cat photos</a>.</p> <p>Click here to view more <a href="#" target="_blank">cat photos</a>.</p>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

10
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph.md
View File

@ -12,7 +12,7 @@ You can nest links within other text elements.
```html ```html
<p> <p>
Here's a <a target="_blank" href="https://www.freecodecamp.org"> link to freecodecamp.org</a> for you to follow. Here's a <a target="_blank" href="https://www.freecodecamp.org"> link to www.freecodecamp.org</a> for you to follow.
</p> </p>
``` ```
@ -34,7 +34,7 @@ Next is the *anchor* element `<a>` (which requires a closing tag `</a>`):
<a href="https://www.freecodecamp.org" target="_blank"> ... </a> <a href="https://www.freecodecamp.org" target="_blank"> ... </a>
``` ```
The text, `link to freecodecamp.org`, within the `a` element is called <dfn>anchor text</dfn>, and will display the link to click: The text, `link to www.freecodecamp.org`, within the `a` element is called <dfn>anchor text</dfn>, and will display the link to click:
```html ```html
<a href=" ... " target="...">link to freecodecamp.org</a> <a href=" ... " target="...">link to freecodecamp.org</a>
@ -42,7 +42,7 @@ The text, `link to freecodecamp.org`, within the `a` element is called <dfn>anch
The final output of the example will look like this: The final output of the example will look like this:
Here's a <a href="https://www.freecodecamp.org" target="_blank">link to freecodecamp.org</a> for you to follow. Here's a <a href="https://www.freecodecamp.org" target="_blank">link to www.freecodecamp.org</a> for you to follow.
# --instructions-- # --instructions--
@ -141,7 +141,7 @@ assert(
<a href="https://www.freecatphotoapp.com" target="_blank">cat photos</a> <a href="https://www.freecatphotoapp.com" target="_blank">cat photos</a>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
@ -155,7 +155,7 @@ assert(
<main> <main>
<p>View more <a target="_blank" href="https://www.freecatphotoapp.com">cat photos</a></p> <p>View more <a target="_blank" href="https://www.freecatphotoapp.com">cat photos</a></p>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

8
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element.md
View File

@ -59,7 +59,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -74,7 +74,7 @@ assert(
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br>
<label for="loving"><input id="loving" type="checkbox" name="personality" value="loving" checked> Loving</label> <label for="loving"><input id="loving" type="checkbox" name="personality" value="loving" checked> Loving</label>
@ -93,7 +93,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<div> <div>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -108,7 +108,7 @@ assert(
<li>other cats</li> <li>other cats</li>
</ol> </ol>
</div> </div>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br>
<label for="loving"><input id="loving" type="checkbox" name="personality" value="loving" checked> Loving</label> <label for="loving"><input id="loving" type="checkbox" name="personality" value="loving" checked> Loving</label>

6
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link.md
View File

@ -14,7 +14,7 @@ You can make elements into links by nesting them within an `a` element.
Nest your image within an `a` element. Here's an example: Nest your image within an `a` element. Here's an example:
```html ```html
<a href="#"><img src="https://bit.ly/fcc-running-cats" alt="Three kittens running towards the camera."></a> <a href="#"><img src="https://www.bit.ly/fcc-running-cats" alt="Three kittens running towards the camera."></a>
``` ```
Remember to use `#` as your `a` element's `href` property in order to turn it into a dead link. Remember to use `#` as your `a` element's `href` property in order to turn it into a dead link.
@ -58,7 +58,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."> <img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back.">
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
@ -72,7 +72,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>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> <p>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>
<p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p> <p>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

8
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field.md
View File

@ -36,7 +36,7 @@ assert($('input').prop('required'));
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -50,7 +50,7 @@ assert($('input').prop('required'));
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL"> <input type="text" placeholder="cat photo URL">
<button type="submit">Submit</button> <button type="submit">Submit</button>
</form> </form>
@ -64,7 +64,7 @@ assert($('input').prop('required'));
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -78,7 +78,7 @@ assert($('input').prop('required'));
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" required placeholder="cat photo URL"> <input type="text" required placeholder="cat photo URL">
<button type="submit">Submit</button> <button type="submit">Submit</button>
</form> </form>

8
curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/use-the-value-attribute-with-radio-buttons-and-checkboxes.md
View File

@ -88,7 +88,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -102,7 +102,7 @@ assert(
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor"> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor"> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor"> Outdoor</label><br>
<label for="loving"><input id="loving" type="checkbox" name="personality"> Loving</label> <label for="loving"><input id="loving" type="checkbox" name="personality"> Loving</label>
@ -121,7 +121,7 @@ assert(
<main> <main>
<p>Click here to view more <a href="#">cat photos</a>.</p> <p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p> <p>Things cats love:</p>
<ul> <ul>
@ -135,7 +135,7 @@ assert(
<li>thunder</li> <li>thunder</li>
<li>other cats</li> <li>other cats</li>
</ol> </ol>
<form action="https://freecatphotoapp.com/submit-cat-photo"> <form action="https://www.freecatphotoapp.com/submit-cat-photo">
<label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor"> Indoor</label> <label for="indoor"><input id="indoor" type="radio" name="indoor-outdoor" value="indoor"> Indoor</label>
<label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br> <label for="outdoor"><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label><br>
<label for="loving"><input id="loving" type="checkbox" name="personality" value="loving"> Loving</label> <label for="loving"><input id="loving" type="checkbox" name="personality" value="loving"> Loving</label>