-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
172 lines (138 loc) · 6.21 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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Flower Shop Website</title>
<!-- for adding latoo font -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@700&family=Open+Sans:wght@800&display=swap"
rel="stylesheet">
<!-- for adding css file -->
<link rel="stylesheet" href="./style/flower.css">
<!-- for adding font awesome icon -->
<script src="https://kit.fontawesome.com/b35e538739.js" crossorigin="anonymous"></script>
</head>
<body>
<header class="header_sec">
<div class="writtings">
<h2 class="heading">Let's make<br>beautiful flowers a<br>part of your life.</h2>
<p class="details">It is a long established fact that a reader will be distracted by the readable content of
a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal
distribution of letters.</p>
<button class="btn-primary">Shop Now</button>
</div>
<div class="image"></div>
</header>
<main>
<!-- <section class="featured">
<div class="divsec">
<h3 class="title">Our Featured Flowers</h3>
<p class="details1">It is a long established fact that a reader will be distracted by the readable
content of a page when looking at its layout.</p>
</div>
<div class="divimg">
<div class="stdiv">
<img src="./images/pngwing-6.png" alt="" class="p">
<p class="text"> <u> Pink Flower Tree</u></p>
</div>
<div class="twdiv">
<img src="./images/pngwing-5.png" alt="" class="p1">
<p class="text"> <u> Pink Flower Tree</u></p>
</div>
<div class="thdiv">
<img src="./images/pngwing-7.png" alt="" class="p2">
<p class="text"> <u> Pink Flower Tree</u></p>
</div>
</div>
</section> -->
<section class="featured">
<h3 class="title">Our Featured Flowers</h3>
<p class="details1">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
<div class="box">
<div class="box-1">
<img src="./images/pngwing-6.png"/>
<strong>Pink Flower Tree</strong>
</div>
<div class="box-2">
<img src="./images/pngwing-5.png"/>
<strong>Pink Flower Tree</strong>
</div>
<div class="box-3">
<img src="./images/pngwing-7.png"/>
<strong>Pink Flower Tree</strong>
</div>
</div>
</section>
<section class="hot-deal">
<div class="writtings">
<h4 class="title">Hot Deal ! Sale Up To 25% <span class="primary-color">Off</span></h4>
<p class="details">It is a long established fact that a reader will be distracted by the readable
content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a
more-or-less normal distribution of letters.</p>
<button class="btn-primary">Sign Up</button>
</div>
<div class="image">
<img src="./images/pngwing-8.png" alt="tulip-flower">
</div>
</section>
<section class="instagram-section">
<h3 class="title">Instagram</h3>
<p class="details1">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
<div class="box">
<div class="box-1">
<img src="./images/flowe-01.png"/>
</div>
<div class="box-2">
<img src="./images/rectangle-4.png"/>
</div>
<div class="box-3">
<img src="./images/rectangle-5.png"/>
</div>
<div class="box-4">
<img src="./images/rectangle-6.png"/>
</div>
</div>
<div class="subscribe-box">
<h2>Get The Latest Deals</h2>
<p>$30 coupon for first shopping</p>
<form>
<input type="text" placeholder="Enter your email here" />
<button class="btn-primary">Subscribe</button>
</form>
</div>
</section>
<section class="discount">
<h3 class="title">Discounted Flowers</h3>
<p class="section-description">These flowers are cheaper than the others flower.You will get 50% discount each of the below flower.Buy it now immediately</p>
<!-- .about-info*4>h4.info-title+p.info-description -->
<div class="about-info-container">
<div class="about-info">
<h4 class="info-title">Red Rose</h4>
<img src="./images/1.jpeg" alt="" class="im">
</div>
<div class="about-info">
<h4 class="info-title">Daisy</h4>
<img src="./images/2.jpeg" alt="" class="im">
</div>
<div class="about-info">
<h4 class="info-title">Tulip</h4>
<img src="./images/3.jpeg" alt="" class="im">
</div>
</div>
</section>
</main>
<footer>
<h4>
<span>Flower</span>
<span>Shop</span>
</h4>
<p>
It is a long established fact that a reader will be distracted by the readable content of a page when
looking at its layout.
</p>
<p class="copy-right">© 2020-2023, FlowerShop.com. All rights reserved. </p>
</footer>
</body>
</html>