Skip to content

Commit e2afe2e

Browse files
gitdagraygitdagray
committed
Added link to starter code for Chapter 6
1 parent 91728b6 commit e2afe2e

12 files changed

+219
-2
lines changed

‎06_lesson/img/caribbean.jpg

21.8 KB
Loading

‎06_lesson/img/html_logo_300x300.png

7.98 KB
Loading

‎06_lesson/img/vacation.jpg

37.8 KB
Loading

‎06_lesson/index.html

+22-2
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,13 @@ <h1>My Goals for the Year</h1>
3131
<section id="html">
3232
<h2>I'm Ready to Learn HTML</h2>
3333
<p>This is my first web page.</p>
34-
34+
<img src="img/html_logo_300x300.png" alt="HTML5 Logo" title="I am learning HTML5" width="300" height="300">
35+
<figure>
36+
<figcaption>An Example of HTML5 code</figcaption>
37+
<p>
38+
<code>&lt;h1&gt;Hello World!&lt;/h1&gt;</code>
39+
</p>
40+
</figure>
3541
<h3>My Daily Schedule</h3>
3642
<p>Let me tell you how:</p>
3743
<ol>
@@ -50,10 +56,17 @@ <h2>I Am Also Planning a Vacation</h2>
5056
<p>I've been working hard and <em>really need a getaway</em>.</p>
5157
<p>I live in <abbr title="Kansas">KS</abbr> so I want visit a beach.</p>
5258

53-
<h3>Place I'd Like to Visit</h3>
59+
<h3>Places I'd Like to Visit</h3>
5460
<ul>
5561
<li>
5662
<p>I've heard good things about the Caribbean.</p>
63+
<figure>
64+
<img src="img/caribbean.jpg" alt="Caribbean Beach" title="I want to visit a Caribbean beach."
65+
width="400" height="225" loading="lazy">
66+
<figcaption>
67+
Caribbean Beach Getaway
68+
</figcaption>
69+
</figure>
5770
</li>
5871
<li>
5972
<p>I've heard good things about going here:</p>
@@ -62,6 +75,13 @@ <h3>Place I'd Like to Visit</h3>
6275
Bahia Petempich Puerto Morelos, Mexico<br>
6376
Colonia Morelos, México 77580
6477
</address>
78+
<figure>
79+
<img src="img/vacation.jpg" alt="Cancun Vacation" title="It's 5 o'Clock Somewhere!" width="400"
80+
height="267" loading="lazy">
81+
<figcaption>
82+
A Caribbean Vacation Image
83+
</figcaption>
84+
</figure>
6585
</li>
6686
</ul>
6787
<!-- TODO: Add more places -->

‎07_lesson/about.html

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="author" content="Dave Gray">
7+
<meta name="description" content="Hi, I'm Dave Gray. This page is about me.">
8+
<title>About Me</title>
9+
<link rel="icon" href="html5.png" type="image/x-icon">
10+
<link rel="stylesheet" href="main.css" type="text/css">
11+
</head>
12+
13+
<body>
14+
<h1>Hi, I'm Dave Gray</h1>
15+
16+
<hr>
17+
18+
<p>
19+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusantium, laborum. Eum iure, ea, corporis odit
20+
excepturi accusamus fugit blanditiis non ipsa, quae asperiores enim esse maiores ipsum illum? Incidunt, ducimus!
21+
</p>
22+
23+
<hr>
24+
25+
<ul>
26+
<li>
27+
Download an <a href="html5.png" download>HTML5 favicon</a>
28+
</li>
29+
<li>
30+
Contact me at <a href="mailto:[email protected]">my email address</a>.
31+
</li>
32+
<li>
33+
Dial <a href="tel:+1234567890">my phone number</a>.
34+
</li>
35+
<li>
36+
Open <a href="https://www.google.com/" target="_blank">Google</a> in a new tab.
37+
</li>
38+
</ul>
39+
40+
<hr>
41+
&lt;&lt;&lt; &copy; <a href="about.html">Dave Gray</a> &gt;&gt;&gt;
42+
<p>
43+
<a href="/">Back to Home</a>
44+
</p>
45+
</body>
46+
47+
</html>

‎07_lesson/html5.png

648 Bytes
Loading

‎07_lesson/img/caribbean.jpg

21.8 KB
Loading

‎07_lesson/img/html_logo_300x300.png

7.98 KB
Loading

‎07_lesson/img/vacation.jpg

37.8 KB
Loading

‎07_lesson/index.html

+129
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="author" content="Dave Gray">
7+
<meta name="description" content="This page contains all the things I am learning how to create as I learn HTML.">
8+
<title>My First Web Page</title>
9+
<link rel="icon" href="html5.png" type="image/x-icon">
10+
<link rel="stylesheet" href="main.css" type="text/css">
11+
</head>
12+
13+
<body>
14+
<header>
15+
<h1>My Goals for the Year</h1>
16+
17+
<nav aria-label="primary-navigation">
18+
<ul>
19+
<li>
20+
<a href="#html">Learning HTML</a>
21+
</li>
22+
<li>
23+
<a href="#vacation">Planning a Vacation</a>
24+
</li>
25+
</ul>
26+
</nav>
27+
</header>
28+
29+
<hr>
30+
<main>
31+
<article id="html">
32+
<h2>I'm Ready to Learn HTML</h2>
33+
<p>This is my first web page.</p>
34+
<section>
35+
<h3>HTML5</h3>
36+
<img src="img/html_logo_300x300.png" alt="HTML5 Logo" title="I am learning HTML5" width="300"
37+
height="300">
38+
<figure>
39+
<figcaption>An Example of HTML5 code</figcaption>
40+
<p>
41+
<code>&lt;h1&gt;Hello World!&lt;/h1&gt;</code>
42+
</p>
43+
</figure>
44+
</section>
45+
<section>
46+
<h3>My Daily Schedule</h3>
47+
<p>Let me tell you how:</p>
48+
<ol>
49+
<li>...I learn more about web dev.</li>
50+
<li>...I plan out my schedule.</li>
51+
<li>...I use resources from <abbr title="Mozilla Developer Network">
52+
<a href="https://developer.mozilla.org/">MDN</a>
53+
</abbr>.</li>
54+
</ol>
55+
<aside>
56+
<details>
57+
<summary>Guess the <mark>number of hours</mark> I code per day</summary>
58+
<p>I start at <time datetime="08:00">8 am</time> and I write code for <time datetime="PT3H">3
59+
hours</time> every morning.</p>
60+
</details>
61+
</aside>
62+
</section>
63+
</article>
64+
65+
<hr>
66+
67+
<article id="vacation">
68+
<h2>I Am Also Planning a Vacation</h2>
69+
<p>I've been working hard and <em>really need a getaway</em>.</p>
70+
<p>I live in <abbr title="Kansas">KS</abbr> so I want visit a beach.</p>
71+
72+
<section>
73+
<h3>Places I'd Like to Visit</h3>
74+
<ul>
75+
<li>
76+
<p>I've heard good things about the Caribbean.</p>
77+
<figure>
78+
<img src="img/caribbean.jpg" alt="Caribbean Beach"
79+
title="I want to visit a Caribbean beach." width="400" height="225" loading="lazy">
80+
<figcaption>
81+
Caribbean Beach Getaway
82+
</figcaption>
83+
</figure>
84+
</li>
85+
<li>
86+
<p>I've heard good things about going here:</p>
87+
<address>
88+
Margaritaville Island Reserve Riviera Cancún<br>
89+
Bahia Petempich Puerto Morelos, Mexico<br>
90+
Colonia Morelos, México 77580
91+
</address>
92+
<figure>
93+
<img src="img/vacation.jpg" alt="Cancun Vacation" title="It's 5 o'Clock Somewhere!"
94+
width="400" height="267" loading="lazy">
95+
<figcaption>
96+
A Caribbean Vacation Image
97+
</figcaption>
98+
</figure>
99+
</li>
100+
</ul>
101+
</section>
102+
<!-- TODO: Add more places -->
103+
<section>
104+
<h3>Places I Want to Avoid</h3>
105+
<dl>
106+
<dt>North Pole</dt>
107+
<dd>I hear this is <strong>cold</strong>!</dd>
108+
109+
<dt>South Pole</dt>
110+
<dd>This is also cold.</dd>
111+
112+
<dt>Mountain Tops</dt>
113+
<dd>These are also cold.</dd>
114+
</dl>
115+
</section>
116+
</article>
117+
</main>
118+
<hr>
119+
<footer>
120+
<p>
121+
&lt;&lt;&lt; &copy; <a href="about.html">Dave Gray</a> &gt;&gt;&gt;
122+
</p>
123+
<p>
124+
<a href="#">Back to Top</a>
125+
</p>
126+
</footer>
127+
</body>
128+
129+
</html>

‎07_lesson/main.css

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
html {
2+
font-size: 22px;
3+
}
4+
5+
body {
6+
background-color: #333;
7+
color: whitesmoke;
8+
}
9+
10+
a {
11+
color: aliceblue;
12+
}
13+
14+
a:visited {
15+
color: lightgray;
16+
}
17+
18+
a:hover, a:active {
19+
color: #eee;
20+
}

‎README.md

+1
Original file line numberDiff line numberDiff line change
@@ -80,4 +80,5 @@
8080
- 🔗 [Chapter 3 Starter Code](https://github.com/gitdagray/html_course/tree/main/02_lesson)
8181
- 🔗 [Chapter 4 Starter Code](https://github.com/gitdagray/html_course/tree/main/03_lesson)
8282
- 🔗 [Chapter 5 Starter Code](https://github.com/gitdagray/html_course/tree/main/04_lesson)
83+
- 🔗 [Chapter 6 Starter Code](https://github.com/gitdagray/html_course/tree/main/05_lesson)
8384

0 commit comments

Comments
 (0)