-
Notifications
You must be signed in to change notification settings - Fork 0
/
GCSE_Bonding.html
181 lines (176 loc) · 6.2 KB
/
GCSE_Bonding.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
175
176
177
178
179
180
181
<!DOCTYPE html>
<html>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<head>
<title>Revisionline</title>
<style>
/* Define styles for the header and footer */
header {
background-color: grey;
color: teal;
padding: 10px;
text-align: center;
font-family: 'Open Sans', sans-serif;
padding-left: 15px;
}
footer {
background-color: grey;
color: lightblue;
padding: 10px;
text-align: center;
font-family: 'Open Sans', sans-serif;
padding-left: 15px;
}
/* Define styles for the menu buttons */
.menu-button {
background-color: grey;
color: lightblue;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
margin-right: 0px;
font-family: 'Open Sans', sans-serif;
list-style-type: none;
position: relative;
display: inline-flex;
align-items: center;
}
.menu-button ul {
display: none;
position: absolute;
top: 100%;
left: 0;
margin: 0;
padding: 0;
background-color: grey;
z-index: 1;
}
.menu-button:hover ul {
display: inline-block;
}
.menu-button li {
margin: 0;
padding: 5px;
list-style-type: none;
}
/* Define styles for the main content */
.main-content {
background-color: white;
padding: 0px;
text-align: left;
font-family: 'Open Sans', sans-serif;
}
body {
font-size: 18px;
line-height: 1.5;
margin: 0;
padding: 0;
}
.contact-button {
display: inline-block;
padding: 10px 20px;
font-size: 18px;
font-weight: bold;
text-decoration: none;
color: white;
background-color: teal;
border-radius: 5px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
</style>
</head>
<script>
var menuButtons = document.querySelectorAll('.menu-button');
// Add touch event listener to each menu button
menuButtons.forEach(function(button) {
button.addEventListener('touchstart', function() {
// Show the dropdown menu on touch tap
if (button.querySelector('ul').style.display === 'none') {
button.querySelector('ul').style.display = 'inline-block';
} else {
button.querySelector('ul').style.display = 'none';
}
});
});
</script>
<body>
<header>
<img src="logo.png">
<div>
<ul>
<li class="menu-button">
<a href="index.html" class="menu-button">Home</a>
<li class="menu-button">
Physics
<ul>
<li><a href="GCSE_Physics.html">GCSE Physics</a></li>
<li><a href="Alevel_Physics.html">A level Physics</a></li>
</ul>
</li>
<li class="menu-button">
Chemistry
<ul>
<li><a href="GCSE_Chem.html">GCSE Chemistry</a></li>
<li><a href="Alevel_Chem.html">A level Chemistry</a></li>
</ul>
</li>
<li class="menu-button">
Maths
<ul>
<li><a href="mathsmatrix.revisionline.co.uk">Maths</a></li>
</ul>
<li class="menu-button">
Biology
<ul>
<li><a href="GCSE_bio.html">GCSE Biology</a></li>
<li><a href="Alevel_bio.html">A level Biology</a></li>
</ul>
</li>
<div class="main-content">
<h1> GCSE Chemistry Revision: Bonding notes</h1>
<h2>Introduction to Bonding</h2>
<p>Bonding is the process of joining two or more atoms together to form a molecule or a compound. There are four main types of bonding in chemistry: ionic bonding, simple covalent (molecular) bonding, giant covalent bonding, and metallic bonding.</p>
<h2>Ionic Bonding</h2>
<p>Ionic bonding occurs between a metal and a non-metal. In ionic bonding, electrons are transferred from the metal to the non-metal to form ions. The metal becomes positively charged, while the non-metal becomes negatively charged. The ions then attract each other to form an ionic compound.</p>
<p>Some properties of ionic compounds include:</p>
<ul>
<li>They have high melting and boiling points</li>
<li>They are brittle and break easily</li>
<li>They conduct electricity when molten or in solution</li>
</ul>
<h2>Molecular Bonding</h2>
<p>Molecular bonding occurs between non-metals. In molecular bonding, atoms share electrons to form molecules. The atoms in a molecule are held together by covalent bonds.</p>
<p>Some properties of molecular compounds include:</p>
<ul>
<li>They have low melting and boiling points</li>
<li>They are usually gases or liquids at room temperature</li>
<li>They do not conduct electricity</li>
</ul>
<h2>Giant Covalent Bonding</h2>
<p>Giant covalent bonding occurs between non-metals. In giant covalent bonding, atoms are joined together by strong covalent bonds to form a giant lattice structure.</p>
<p>Some examples of giant covalent structures include:</p>
<ul>
<li>Diamond</li>
<li>Graphite</li>
<li>Silicon dioxide</li>
</ul>
<p>Some properties of giant covalent structures include:</p>
<ul>
<li>They have high melting and boiling points</li>
<li>They are very hard and difficult to break</li>
<li>They do not conduct electricity (except for graphite)</li>
</ul>
<h2>Metallic Bonding</h2>
<p>Metallic bonding occurs between metals. In metallic bonding, the metal atoms are held together by a sea of delocalized electrons, which are free to move throughout the lattice.</p>
<p>Some properties of metallic compounds include:</p>
<ul>
<li>They have high melting and boiling points</li>
<li>They are malleable and ductile</li>
<li>They conduct electricity and heat well</li>
</ul>
</ul>
</div>
</body>
<footer> © 2023 Revisionline, All rights reserved. <a href="mailto:info@revisionline.co.uk" class="contact-button">E- mail</a></footer>
</html>