web.1.0-learn-semantic-markup/challenge-5.html at master · mekcherie/web.1.0-learn-semantic-markup · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<!DOCTYPE html>
<html>
  <head> </head>
  <body>
    <article>
      <header>
        <h1>Weather forecast for Seattle</h1>
        <small>Three day forecast</small>
      </header>
      <dl>
        <dt><time>03 March 2018</time></dt>
        <dd>Rain.</dd>
        <dt><time>04 March 2018</time></dt>
        <dd>Periods of rain.</dd>
        <dt><time>05 March 2018</time></dt>
        <dd>Heavy rain.</dd>
      </dl>
    </article>
  </body>
</html>

<!--

	This is a weather forecast. It shows the location and the dates
	for a three day forecast. This seems very simple but it could
	use some thought.

	All of the information here is related. it's probably an article.
	The first two lines are probably a header for the rest of the
	information.
	The forecast is a list of dates and forecasts.

	A list would work here. HTML provides a special type of list
	called a definition list <dl>. The definition list uses two
	parts for every list element a title <dt> and a definition <dd>
	Often a list has title and body for each item. This a definition
	list describes.

	https://www.w3schools.com/tags/tag_dl.asp
	https://htmldog.com/guides/html/intermediate/definitionlists/

	Tags to use:

	- article
	- header
	- dl, dt, dd or ul, li
	- time

 -->