-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathCOMET.html
174 lines (130 loc) · 5.75 KB
/
COMET.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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
<!DOCTYPE html>
<html>
<head>
<title>COMET</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="https://xp.io/storage/2OAx8lAO.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans&family=Titillium+Web:wght@200;300&display=swap" rel="stylesheet">
<!-- FOR HEADER -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Bakbak+One&display=swap" rel="stylesheet">
<style>
body{
background-image: url('https://cdn.pixabay.com/photo/2015/09/29/15/12/stars-964022_960_720.png');
color :white ;}
.column {
float:left;
width:33.33%;
line-height:2rem;
text-align: center;
letter-spacing: 0.0100em;
font-family:"titillium web";
font-size: 22px;
}
.row:after {
content: "";
display: table;
clear: both;
}
@media screen and (max-width:600px) {
.column {
width:100%;
}
}
a{
color: white;
font-size: 22px;
text-decoration: none;
margin-top: 15px;
}
header { color: white ; }
#header_1{
background-color: black;
text-align: center;
width: 1017px;
height: 80px;
margin-top: -10px;
margin-right: 0px;
margin-left: -15px;
display: flex;
justify-content: space-around;
margin-bottom: -15px;
font-family: 'Bakbak One', cursive;
width: 100%;
}
h1{ text-align: center;
font-family:"titillium web";
text-decoration: underline;
;
}
#ANNIMATION{
width: 33.33%;
height: 98vh;
background-size: 100%;
background-repeat: no-repeat;
;
background-color: black;
position: relative;
animation-name: example;
animation-duration: 7s;
animation-timing-function: linear;
animation-delay: 1s;
animation-iteration-count: infinite;
animation-direction: alternate;
}
@keyframes example {
0% {background-image: url(https://w0.peakpx.com/wallpaper/284/940/HD-wallpaper-blue-comet-blue-galaxy-meteor-neon-night-ocean-sky-space-star-water.jpg);}
50% {background-image: url(https://i.pinimg.com/736x/63/47/d5/6347d5dea5443ce6c3447f620edb0123.jpg);}
100% {background-image: url(https://images.unsplash.com/photo-1595485958240-70d93f5713e5?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTJ8fGNvbWV0fGVufDB8fDB8fA%3D%3D&w=1000&q=80);}
</style>
</head>
<body>
<header>
<div id="header_1">
<img src="https://xp.io/storage/2OApv9xP.png">
<a href=""></a>
<a href="file:///C:/Users/HP/OneDrive/Desktop/HTML/FA2/homePAGE.html"> Home</a>
<a href="file:///C:/Users/HP/OneDrive/Desktop/HTML/PROJECT/merchandise.html"> Merchandise</a>
<a href=""> Contact </a>
<a href="file:///C:/Users/HP/OneDrive/Desktop/HTML/PROJECT/about-us.html">About us</a>
<a href=""></a>
</header>
<br>
<main>
<h1> <B>COMET</B></h1>
<div class="row">
<div class="column" >comet, a small body orbiting the Sun with a substantial fraction of its composition made up of volatile ices. When a comet comes close to the Sun, the ices sublimate (go directly from the solid to the gas phase) and form, along with entrained dust particles, a bright outflowing atmosphere around the comet nucleus known as a coma. As dust and gas in the coma flow freely into space, the comet forms two tails, one composed of ionized molecules and radicals and one of dust. The word comet comes from the Greek κομητης (kometes), which means “long-haired.”
<BR>
<BR>Comets are important to scientists because they are primitive bodies left over from the formation of the solar system. They were among the first solid bodies to form in the solar nebula, the collapsing interstellar cloud of dust and gas out of which the Sun and planets formed. Comets formed in the outer regions of the solar nebula where it was cold enough for volatile ices to condense. This is generally taken to be beyond 5 astronomical units (AU; 748 million km, or 465 million miles), or beyond the orbit of Jupiter.
</div>
<div class="column" id="ANNIMATION"></div>
<div class="column">
Thus, they retain a physical and chemical record of the primordial solar nebula and of the processes involved in the formation of planetary systems.A comet is made up of four visible parts: the nucleus, the coma, the ion tail, and the dust tail. The nucleus is a solid body typically a few kilometres in diameter and made up of a mixture of volatile ices (predominantly water ice) and silicate and organic dust particles. The dust tail forms from those dust particles and is blown back by solar radiation pressure to form a long curving tail that is typically white or yellow in colour.
<BR>
<BR>
The ion tail forms from the volatile gases in the coma when they are ionized by ultraviolet photons from the Sun and blown away by the solar wind. Ion tails point almost exactly away from the Sun and glow bluish in colour because of the presence of CO+ ions.
Comets differ from other bodies in the solar system in that they are generally in orbits that are far more eccentric than those of the planets and most asteroids and far more inclined to the ecliptic (the plane of Earth’s orbit).
<br>
<BR>
</div>
</main>
<div style="background-color: black; text-align: center ;
font-family: 'Bakbak One', cursive;
width: 100%; ;" >
<hr>
<H2>
HOPE YOU ENJOYED TODAY'S ADVENTURE 😊
</H2>
<br>
<a href="file:///C:/Users/HP/OneDrive/Desktop/HTML/FA2/homePAGE.html" title="">HOME</a><br>
<a href="file:///C:/Users/HP/OneDrive/Desktop/HTML/PROJECT/about-us.html" title="">ABOUT US</a><br>
<a href="" title="">QUIZ</a><br>
<a href="file:///C:/Users/HP/OneDrive/Desktop/HTML/PROJECT/merchandise.html" title="">MERCHANDISE</a><br>
<a href="" title="">NEWS</a><br>
</div>
</body>
</html>