-
Notifications
You must be signed in to change notification settings - Fork 14
/
25-descendants-of-khan.html
64 lines (55 loc) · 1.97 KB
/
25-descendants-of-khan.html
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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!--
This webpage describes Genghis Khan, an emperor who had many descendants, and includes a table with just a few of the
emperors that descended from him. Add a rule that targets only the elements that have the 'emperor' class and are in the
table. The rule should change the background color of those table cells.
Now add another rule that targets only the elements that have the class name 'reign' and in the table. Like in the first
step, the rule should change the background color of those table cells. Pick a different color than you picked for the
other rule!
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Challenge: Descendants of Khan</title>
<style>
.emperor {
font-family: cursive;
}
.reign {
font-family: monospace;
}
table .emperor {
background-color:rgb(219, 72, 72);
}
table .reign {
background-color:rgb(174,180,234);
}
</style>
</head>
<body>
<h1>Descendants of Khan</h1>
<p><strong class="emperor">Genghis Khan</strong> (<span class="reign">1206-1227</span>) was a emperor who had many sons and daughters, and many famous emperors are descended from him. (But not Sal Khan!)</p>
<table>
<thead>
<tr>
<th>Name</th>
<th>Reign</th>
</tr>
</thead>
<tbody>
<tr>
<td class="emperor">Ögedei Khan</td>
<td class="reign">1229-1241</td>
</tr>
<tr>
<td class="emperor">Kublai Khan</td>
<td class="reign">1260-1294</td>
</tr>
<tr>
<td class="emperor">Temür Khan</td>
<td class="reign">1294-1307</td>
</tr>
</tbody>
</table>
</body>
</html>