forked from CodeYourFuture/HTML-CSS-Coursework-Week3
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
76 lines (60 loc) · 2.48 KB
/
index.html
File metadata and controls
76 lines (60 loc) · 2.48 KB
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
<!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>Responsive Cake webpage</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header id="header">
<div class="header-img">
<img id="header-img" src="./design/Catcake.jpg">
<div class="header-text">
<h1>The best cupcakes in town delivered to your door</h1>
</div>
</div>
</header>
<div class="nav-bar">
<nav id="nav-bar">
<ul class="links">
<a class="nav-link" href="#Karma">Cupcakes</a>
<a class="nav-link" href="#Works">More Cakes</a>
<a class="nav-link" href="#Store">Store</a>
<a class="nav-link" href="#Blog">Prices</a>
<a class="nav-link" href="#Help">Contact Us</a>
</ul>
</nav>
</div>
<div class="main">
<div class="main-img">
<img id="main-image"src="./design/Cutecatcake.jpg">
<h2 class = "welcome">Welcome</h2>
<p class="main-paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer pharetra nisl neque, id tincidunt diam eleifend a. Etiam felis mauris, commodo at quam et, feugiat suscipit ligula. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec gravida lectus id velit sollicitudin, ac scelerisque dui volutpat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Maecenas euismod et urna quis iaculis. Phasellus pulvinar .</p>
</div>
</div>
<div class="row">
<div class="product">
<img id="product-img" src="./design/cupcake1.jpg" alt="cupcake1" style="width:100%">
</div>
<div class="product">
<img id="product-img" src="./design/cupcake2.jpg" alt="cupcake2"style="width:100%">
</div>
<div class="product">
<img id="product-img" src="./design/cupcake4.jpg" alt="cupcake3" style="width:100%">
</div>
<div class="product">
<img id="product-img" src="./design/cupcake3.jpg" alt="cupcake4" style="width:100%">
</div>
</div>
<footer>
<div class = "footer">
<h3>This is My Footer</h3>
<div class="social-media-icons">
</div>
<h4>All Rights Reserved @Cakes </h4>
</div>
</footer>
</body>
</html>