HTML section of Front End Developer

Lesson 2: HTML Syntax
=====================
3. Quiz: Make your first element
--------------------------------
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>1st element</title>
</head>
<body>
<p>paragraph</p>
<span>span 1</span>
<span>span 2</span>
</body>
</html>

10. Quiz: Spot the Bug
----------------------
Options 1, 3, 4

11. Quiz: HTML Research
-----------------------
<p><strong>This text should be bold.</strong></p>
<p><em>And this text should have emphasis (italics).</em></p>

13. HTML Documents in Depth
---------------------------
Question 1: 1, 4
Question 2: 4

Lesson 3: HTML Syntax Problem Set
=================================
2. Make a button
----------------
<button>A button</button>

5. Quiz: Make All the Headers
-----------------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Headers Quiz</title>
</head>
<body>
<p>Add your headers below this paragraph element! Add an h1, h2, h3, and h4 to finish the quiz. And make sure every header has text content :)</p>
<h1>Biggest header</h1>
<h2>Smaller header</h2>
<h3>Even smaller</h3>
<h4>Not the smallest, actually. <code>&lt;h6&gt;</code> is the smallest.</h4>
</body>
</html>

6. Quiz: Make a List
--------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Lists Quiz</title>
</head>
<body>
<p>Create an unordered list! Make a list of the three web languages: HTML, CSS and JavaScript.</p>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</body>
</html>

7. Quiz: Tree to HTML
---------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Tree to HTML</title>
</head>
<body>
<h1>Heading</h1>
<div>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
</div>
</body>
</html>

8. Constructing Links
---------------------
<a href="https://www.google.com">Google</a>

9. Quiz: Add an Image
---------------------
<p>
This is a big paragraph of text about Udacity. Cool. Cool. And here is an image!
<img src="http://udacity.github.io/fend/images/udacity.png" alt="Udacity logo">
Here's another question for you: how is the text reacting to the image? Is the image on its own line or is it showing up in the same last as the rest of the text?
</p>

11. Quiz: Figures
-----------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Figures Quiz</title>
</head>
<body>
<figure>
<img src="redwoods_state_park.jpg" alt="Redwoods">
<figcaption>Stout Memorial Grove in Jedediah Smith Redwoods State Park in 2011 by Chmee2 (Own work) GFDL or CC BY-SA 3.0, via Wikimedia Commons - <a href="https://commons.wikimedia.org/wiki/File%3AStout_Memorial_Grove_in_Jededi...(22).JPG">[Source]</a></figcaption>
</figure>
</body>
</html>