-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtechnology-spaceport.html
65 lines (60 loc) · 2.24 KB
/
technology-spaceport.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
65
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/favicon-32x32.png">
<link rel="stylesheet" href="common.css">
<title>Frontend Mentor | Space tourism website</title>
</head>
<body id="tech">
<div id="nav">
<img src="./assets/shared/logo.svg" alt="Logo">
<hr>
<div id="anc">
<div><a href="./index.html">00 <span>Home</span></a></div>
<div><a href="./destination-moon.html">01 <span>Destination</span></a></div>
<div><a href="./crew-commander.html">02 <span>Crew</span></a></div>
<div><a href="./technology-vehicle.html">03 <span>Technology</span></a></div>
</div>
</div>
<div id="techPage">
<h5>03 <span>Space launch 101</span></h5>
<div id="mainBody">
<div>
<div id="num">
<a href="./technology-vehicle.html">1</a>
<a href="./technology-spaceport.html">2</a>
<a href="./technology-capsule.html">3</a>
</div>
<div id="para">
<p>the terminology...</p>
<p>Spaceport</p>
<p>A spaceport or cosmodrome is a site for launching (or receiving) spacecraft, by analogy to the seaport for ships or airport for aircraft. Based in the famous Cape Canaveral, our spaceport is ideally situated to take advantage of the Earth’s rotation for launch.</p>
</div>
</div>
<div id="img2">
<img src="./assets/technology/image-spaceport-portrait.jpg" alt="launch">
</div>
</div>
</div>
</body>
</html>
<script>
let div1 = document.querySelector("#anc>div:nth-child(1)");
div1.addEventListener("click",function(){
div1.style.borderBottom = "3px solid white";
});
let div2 = document.querySelector("#anc>div:nth-child(2)");
div2.addEventListener("click",function(){
div2.style.borderBottom = "3px solid white";
});
let div3 = document.querySelector("#anc>div:nth-child(3)");
div3.addEventListener("click",function(){
div3.style.borderBottom = "3px solid white";
});
let div4 = document.querySelector("#anc>div:nth-child(4)");
div4.addEventListener("click",function(){
div4.style.borderBottom = "3px solid white";
});
</script>