-
Notifications
You must be signed in to change notification settings - Fork 0
/
quiz.html
245 lines (192 loc) · 7.76 KB
/
quiz.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
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>girldevelopit-reveal.js - The GDI HTML Presentation Framework</title>
<meta name="description" content="Girl Develop It framework for easily creating beautiful presentations using HTML in GDI theme. Forked from Hakim El Hattab's reveal.js">
<meta name="author" content="Girl Develop It">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<link rel="stylesheet" href="css/reveal.css">
<link rel="stylesheet" href="css/theme/simple.css" id="theme">
<!-- For syntax highlighting -->
<!-- light editor<link rel="stylesheet" href="lib/css/light.css">-->
<!-- dark editor--><link rel="stylesheet" href="lib/css/dark.css">
<link rel="stylesheet" href="lib/css/zenburn.css">
<link rel="stylesheet" href="plugin/accessibility-helper/css/accessibility-helper.css">
<!-- If the query includes 'print-pdf', include the PDF print sheet -->
<script>
if( window.location.search.match( /print-pdf/gi ) ) {
var link = document.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = 'css/print/pdf.css';
document.getElementsByTagName( 'head' )[0].appendChild( link );
}
</script>
<!-- If use the PDF print sheet so students can print slides-->
<link rel="stylesheet" href="css/print/pdf.css" type="text/css" media="print">
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<!--[if lt IE 9]>
<script src="lib/js/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<div class="reveal">
<!-- Any section element inside of this container is displayed as a slide -->
<div class="slides">
<section>
<h2>Retrieval Practice</h2>
<hr>
<p style="font-size: 60%;"><a href="http://www.theguardian.com/lifeandstyle/2012/jan/14/how-to-train-your-brain-to-remember" target="_blank">Why retrieval practice helps you remember better</a></p>
</section>
<section>
<h3>Question 1</h3>
<p><strong><em>In what</em></strong> should our index.html and other files for our website be kept?</p>
</section>
<section>
<h3>Question 2</h3>
<p>What is the first line of your html page?</p>
</section>
<section>
<h3>Question 3</h3>
<p>How many id’s can you have in one html page?</p>
</section>
<section>
<h3>Question 4</h3>
<p>What HTML tag makes a link?</p>
<hr>
<p><strong>Bonus:</strong> What attribute do you add to a link to help screen readers?</p>
</section>
<section>
<h3>Question 5</h3>
<p>Is CSS a type of HTML?</p>
</section>
<section>
<h3>Question 6</h3>
<p>What does CSS do?</p>
</section>
<section>
<h3>Question 7</h3>
<p>What is the preferred way to connect your CSS to your HTML file?</p>
</section>
<section>
<h3>Question 8</h3>
<p>How do I create a border just on the top of my element?</p>
</section>
<section>
<h3>Question 9</h3>
<p>What CSS styles make my element wider and taller?</p>
</section>
<section>
<h3>Question 10</h3>
<p>What is an example of an inline element and an example of a block element?</p>
</section>
<section>
<h3>Question 11</h3>
<p>If I want to float an element, what style MUST be set?</p>
</section>
<section>
<h3>Question 12</h3>
<p>What style do I use to stop floating elements?</p>
</section>
<section>
<h3>Question 13</h3>
<p>What 3 or 4 measurements can we use for the font-size?</p>
</section>
<section>
<h3>Question 14</h3>
<p>How do I write the font shorthand style?</p>
</section>
<section>
<h3>Question 15</h3>
<p>Does padding increase the total width & height of an element?</p>
</section>
<section>
<h3>Question 16</h3>
<p>How can I set the padding to 10px on the top, 20px on the right, 10px on the bottom, and 20px on the left?</p>
</section>
<section>
<h3>Question 17</h3>
<p>Does margin increase the total width & height of an element?</p>
</section>
<section>
<h3>Question 18</h3>
<p>How do I set the margin for all the sides to be the same?</p>
</section>
<section>
<h3>Question 19</h3>
<p>How can I horizontally center my body tag?</p>
</section>
<section>
<h3>Question 20</h3>
<p>How do I right-align my text?</p>
</section>
<section>
<h3>Question 21</h3>
<p>What tag can I use to apply a specific style to one word in my paragraph?</p>
</section>
<section>
<h3>Question 22</h3>
<p>What are 2 ways I can set the color of an element? <em>(There are 3 total)</em></p>
</section>
<section>
<h3>Question 23</h3>
<p>How can I make my background color black?</p>
</section>
<section>
<h3>Question 24</h3>
<p>What pseudo-class do I use to change the color when I hover over a link?</p>
</section>
<section>
<h3>Question 25</h3>
<p>What is the CSS style for underlining an element?</p>
</section>
<section>
<h3>Question 26</h3>
<p>Which element did we discuss that has no semantic meaning?</p>
</section>
<section>
<h3>Question 27</h3>
<p>What kind of path will let me link to an image or file in the same or sub-directory?</p>
</section>
<section>
<h3>Question 28</h3>
<p>What kind of path will let me link to an image or file anywhere on the web?</p>
</section>
<section>
<h3>You Made It! Great Work!</h3>
</section>
</div>
<footer>
<div class="copyright">
HTML101: Intro to HTML & CSS -- Girl Develop It SLC
<a rel="license" href="http://creativecommons.org/licenses/by-nc/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-nc/3.0/80x15.png" /></a>
</div>
</footer>
</div>
<script src="lib/js/head.min.js"></script>
<script src="js/reveal.min.js"></script>
<script>
// Full list of configuration options available here:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
controls: true,
progress: true,
history: true,
center: true,
transition: 'slide', // none/fade/slide/convex/concave/zoom
// Optional reveal.js plugins
dependencies: [
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'plugin/highlight/highlight.js', async: true, condition: function() { return !!document.querySelector( 'pre code' ); }, callback: function() { hljs.initHighlightingOnLoad(); } },
{ src: 'plugin/zoom-js/zoom.js', async: true },
{ src: 'plugin/notes/notes.js', async: true },
{ src: 'plugin/accessibility-helper/js/accessibility-helper.js', async: true, condition: function() { return !!document.body.classList; } }
]
});
</script>
</body>
</html>