-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
49 lines (41 loc) · 2.05 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Intro to Web Design</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<! --- Fonts link goes here --- >
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400;1,700&family=Merriweather:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet">
</head>
<body>
<script src="script.js"></script>
<h1>Intro. to Web Design</h1>
<h3>CRAP</h3>
<h5>Contrast</h5>
<p>Show an example of contrast.</p>
<h5>Repetition</h5>
<p>Show an example of repetition.</p>
<h5>Alignment</h5>
<p>Show an example of alignment.</p>
<h5>Proximity</h5>
<p>Show an example of proximity.</p>
<h3>Other Key Design Principles</h3>
<h5>Hierarchy</h5>
<p>Show an example of hierarchy.</p>
<h5>White Space</h5>
<p>Show an example of white space.</p>
<h5>Harmony</h5>
<p>Show an example of harmony.</p>
<h5>Readability</h5>
<p>Show an example of readability.</p>
<quote>Either the well was very deep, or she fell very slowly, for she had plenty of time as she went down to look about her and to wonder what was going to happen next….then she looked at the sides of the well, and noticed that they were filled with cupboards and book-shelves; here and there she saw maps and pictures hung upon pegs. She took down a jar from one of the shelves as she passed; it was labelled ‘ORANGE MARMALADE’, but to her great disappointment it was empty: (Ch. 1)</quote>
<h3>Style Sheets</h3>
<h5>Inline Styles</h5>
<h1 style="color: #8f6794; font-size: 58px;">This is an H1 head with a color style. </h1>
<span style="color: #8f6794;">This is a sentence with color applied through “span.” </span>
</body>
</html>