-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
151 lines (69 loc) · 3.03 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./assets/style.css">
<title>Prework Study Guide</title>
</head>
<body>
<header id="header">
<h1>Prework Study Guide</h1>
<img src="./assets/bowtie-cat.png" alt="Profile image of cat wearing a bow tie." />
<h2>✨ Open the Console to See What's Happening ✨</h2>
</header>
<main>
<!--THIS SECTION IS FOR HTML-->
<section class="card" id="html-section">
<h2>HTML</h2>
<ul>
<li>The head element contains info about the webpage.</li>
<li>The body element represents the visible cotent shown to the user.</li>
<li>Doctype is not case sensitive! It's job is to declare to the browser what document type to open.</li>
<li>ʕ´• ᴥ•̥`ʔ</li>
</ul>
</section>
<!--THIS SECTION IS FOR CSS-->
<section class="card" id="css-section">
<h2>CSS</h2>
<ul>
<li>CSS is used to develop how webpages are displayed.</li>
<li>CSS defines the colours, aesthetics, visual layout and organisation.</li>
<li>Common practice is to use External CSS which can be linked to our main HTML file later.</li>
<li>We can apply CSS to images too!</li>
<li>ʕっ•ᴥ•ʔっ</li>
</ul>
</section>
<!--THIS SECTION IS FOR GIT-->
<section class="card" id="git-section">
<h2>GIT</h2>
<ul>
<li>We use git commnands to access various directories in our PC without the need to rely on a GUI.</li>
<li>There are plethera of commands we can use through the terminal in order to do this.</li>
<li>On Windows we use a software called Git Bash to do the same.</li>
<li>git status: checks what branch we are currently on.</li>
<li>git checkout -b branch name: creates a new branch and switches to it.</li>
<li>ʕ ˶ ❛ ᴥ ❛ ʔ</li>
</ul>
</section>
<!--THIS SECTION IS FOR JAVASCRIPT-->
<section class="card" id="javascript-section">
<h2>JAVASCRIPT</h2>
<ul>
<li>JavaScript is the tool we use to make our web application interactive.</li>
<li>JavaScript is an OOP that gives our content logic.</li>
<li>Variables are named containers that allow us to store data in our code.</li>
<li>Arrays are a group of related data that get assigned an index number.</li>
<li>Functions are a set of instructions that tell the computer how to perform a certain task.</li>
<li>୧ʕ•̀ᴥ•́ʔ୨</li>
</ul>
</section>
</main>
<footer>
<p>I can code!</p>
</footer>
<script src="./assets/script.js">
</script>
</body>
</html>