-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
115 lines (101 loc) · 3.15 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Coffee Addict Recording</title>
</head>
<body>
<main>
<header>
<img src="./images/logo.png" id="logo" alt="coffee logo" />
<h1>Coffee Addict V2</h1>
<nav>
<!-- navbar -->
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="numbers.html">Numbers</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
<!-- hero image -->
<img src="./images/background.jpeg" alt="coffee beans" width="100%" />
</header>
<br />
<article>
<h2>Featured Products</h2>
<br />
<article>
<!-- house blend -->
<h3>House Blend Coffee</h3>
<img src="./images/house-blend.jpeg" alt="house blend" />
<p style="width: 50%">
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Modi quisquam
illo similique fugit earum delectus, eaque, deserunt impedit, asperiores
quibusdam nam enim rem commodi eius consectetur perspiciatis nobis
necessitatibus corrupti exercitationem eos dicta quos itaque aspernatur
accusantium? Facere ipsam inventore, porro quia, voluptates nulla deleniti
officiis cumque molestiae id at.
</p>
<nav>
<h4>
<a href="https://en.wikipedia.org/wiki/Coffee" target="_blank">Details</a>
</h4>
</nav>
<!-- end of house blend -->
</article>
<article>
<!-- French Roast -->
<h3>French Roast</h3>
<img src="./images/french-roast.jpeg" alt="french roast" />
<p style="width: 50%">
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Modi quisquam
illo similique fugit earum delectus, eaque, deserunt impedit, asperiores
quibusdam nam enim rem commodi eius consectetur perspiciatis nobis
necessitatibus corrupti exercitationem eos dicta quos itaque aspernatur
accusantium? Facere ipsam inventore, porro quia, voluptates nulla deleniti
officiis cumque molestiae id at.
</p>
<nav>
<h4>
<a href="https://en.wikipedia.org/wiki/Coffee" target="_blank">Details</a>
</h4>
</nav>
<!-- end of french roast -->
</article>
<article>
<!-- Columbian Roast -->
<h3>Columbian Roast</h3>
<img src="./images/columbian-roast.jpeg" alt="Columbian Roast" />
<p style="width: 50%">
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Modi quisquam
illo similique fugit earum delectus, eaque, deserunt impedit, asperiores
quibusdam nam enim rem commodi eius consectetur perspiciatis nobis
necessitatibus corrupti exercitationem eos dicta quos itaque aspernatur
accusantium? Facere ipsam inventore, porro quia, voluptates nulla deleniti
officiis cumque molestiae id at.
</p>
<nav>
<h4>
<a href="https://en.wikipedia.org/wiki/Coffee" target="_blank">Details</a>
</h4>
</nav>
<!-- end of Columbian Roast -->
</article>
</article>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<footer>
<p>copyrigth ©2022</p>
<h3><a href="#logo">Back To Top</a></h3>
</footer>
</main>
</body>
</html>