-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
104 lines (100 loc) · 3.91 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
<!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." />
</header>
<main>
<section class="card" id="html-section">
<h2>HTML</h2>
<ul>
<li>The head option sets up your meta dada. This includes things like your tab heading</li>
<li>The body element represents the visible content shown to the user</li>
<li>Headings are placed using the elements h1 through h6</li>
<li>Lists are made using either the ul element to represent an unordered list or ol to represent and ordered list. In either case you will use li to create list items</li>
<li>More things to come</li>
</ul>
</section>
<section class="card" id="css-section">
<h2>CSS</h2>
<p>There are three different kinds of CSS code.</p>
<ol>
<li>Inline CSS - Dealing with specific elements</li>
<li>Internal CSS - Rules in the head, they only apply to the current page</li>
<li>External CSS - Seperate File that applies to the whole site, its linked via the head on each page</li>
</ol>
<br>
<br>
<p>In general, CSS rules are made up of:</p>
<ol>
<li>The selector</li>
<li>Declarations that together make the Declaration Block</li>
<li> Properties followed by Values</li>
</ol>
<br>
<h3> List of Properties</h3>
<ul>
<li>Color</li>
<li>text-align</li>
<li>margin (can add specified areas)</li>
<li>padding (space between the boarder of a page and the content)</li>
<li>Display</li>
<li>font-size</li>
<li>width</li>
<li>Boarder</li>
<li>Box Shadow</li>
</ul>
<p>Selector List (combine selectors with commas)</p>
<ul>
<li>* (for all elements on page)</li>
<li>header</li>
<li>footer</li>
<li>img</li>
<li>.card</li>
</ul>
<p>Value List</p>
<ul>
<li>Block (assigns image to start on new line)</li>
</ul>
</section>
<br>
<section class="card" id="git-section">
<h2>Git</h2>
<ul>
<li>To see which branch we're in use the command "git status"</li>
<li>To create a new feature branch use there command "git checkout -b NEW NAME"
Git checkout tells it to switch branches,
-b tells it a new branch followed by the new branch name
</li>
<li>To record changes to a file use the command "git add -A"</li>
<li>To commit changes use the command "git commit -m 'Detailed message about change'"</li>
<li>Pull to ensure latest commits/changes use the command "git pull origin main"
Pulling is to put a change into a local setting. Origin is telling it that its in GitHub Reopsitory and main is tellig it the branch.
</li>
<li>To push out changes use the command "git push origin 'Branch name'"
Pushing takes it from local into GitHub's cloud.
This is also another way to create a new branch.
</li>
<li> Using a - followed by a letter is what is called a flag in Git</li>
</ul>
</section>
<section class="card" id="javascript-section">
<h2>JavaScript</h2>
<ul>
<li>Eneter JavasScript notes ehre</li>
</ul>
</section>
</main>
<footer>
<p>I can code!</p>
</footer>
</body>
</html>