-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
79b6a5a
commit 00e894e
Showing
4 changed files
with
264 additions
and
89 deletions.
There are no files selected for viewing
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,100 +1,186 @@ | ||
| <!DOCTYPE html> | ||
| <!doctype html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <link rel="stylesheet" href="style.css"> | ||
| <title>Flower Shop</title> | ||
| </head> | ||
| <body> | ||
| <!-- Header section Started --> | ||
| <header> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <link rel="stylesheet" href="style.css" /> | ||
| <title>Flower Shop</title> | ||
| </head> | ||
| <body> | ||
| <!-- Header section Started --> | ||
| <header></header> | ||
|
|
||
| <!-- Main section Started --> | ||
| <main> | ||
| <!--Banner Container --> | ||
| <div class="banner-container"> | ||
| <div class="banner-descriptions"> | ||
| <h1 class="banner-title"> | ||
| Let's make <br /> | ||
| beautiful flowers a <br /> | ||
| part of your life. | ||
| </h1> | ||
| <p class="banner-text"> | ||
| 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 type="button" class="btn">Shop Now</button> | ||
| </div> | ||
| <!-- Banner image --> | ||
| <div class="banner-img"> | ||
| <img | ||
| src="flower-shop-assignment-main/Flower Asset/pngwing 10.png" | ||
| alt="_flower" | ||
| class="image" | ||
| /> | ||
| </div> | ||
| </div> | ||
|
|
||
| </header> | ||
|
|
||
| <!-- Main section Started --> | ||
| <main> | ||
| <!--Banner Container --> | ||
| <div class="banner-container"> | ||
| <div class="banner-descriptions"> | ||
| <h1 class="banner-title"> | ||
| Let's make <br> beautiful flowers a <br> part of your life. | ||
| </h1> | ||
| <p class="banner-text"> | ||
| 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 type="button" class="btn">Shop Now</button> | ||
| </div> | ||
| <!-- Banner image --> | ||
| <div class="banner-img"> | ||
| <img src="flower-shop-assignment-main/Flower Asset/pngwing 10.png" alt="_flower" class="image"> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- discount --> | ||
| <div class="discount-container"> | ||
| <div class="discount-text"> | ||
| <h1> | ||
| Hot Deal ! Sale Up To 25% <span class="off">Off</span> | ||
| </h1> | ||
| <p>It is a long established fact that a reader will be distracted by the readable <br>content of a page when looking at its layout.</p> | ||
| <button type="button" class="btn">Sign UP</button> | ||
| </div> | ||
| <div class="discount-image"> | ||
| <img src="flower-shop-assignment-main/Flower Asset/pngwing 8.png" alt=""> | ||
| </div> | ||
| <!-- Feature Flower --> | ||
| <div class="feature_flower"> | ||
| <div class="feature_description"> | ||
| <h1>Our Feature Flowers</h1> | ||
| <p> | ||
| It is a long established fact that a reader will be distracted by | ||
| the readable <br /> | ||
| content of a page when looking at its layout. | ||
| </p> | ||
| </div> | ||
| <div class="feature_box"> | ||
| <div class="box" id="box1"> | ||
| <img src="flower-shop-assignment-main/Flower Asset/pngwing 6.png" alt=""> | ||
| <p> | ||
| Pink Flower Tree | ||
| </p> | ||
| </div> | ||
|
|
||
| <!-- Instagram --> | ||
| <div class="instagram"> | ||
| <h1>Instagram</h1> | ||
| <p>It is a long established fact that a reader will be distracted by the readable <br>content of a page when looking at its layout.</p> | ||
| <div class="box" id="box2"> | ||
| <img src="flower-shop-assignment-main/Flower Asset/pngwing 5.png" alt=""> | ||
| <p> | ||
| Pink Flower Tree | ||
| </p> | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
| <div class="image-gallery"> | ||
| <div><img src="flower-shop-assignment-main/Flower Asset/Flower 01.png" alt=""></div> | ||
| <div><img src="flower-shop-assignment-main/Flower Asset/Rectangle 4.png" alt=""></div> | ||
| <div><img src="flower-shop-assignment-main/Flower Asset/Rectangle 5.png" alt=""></div> | ||
| <div><img src="flower-shop-assignment-main/Flower Asset/Rectangle 6.png" alt=""></div> | ||
| <div class="box" id="box3"> | ||
| <img src="flower-shop-assignment-main/Flower Asset/pngwing 7.png" alt=""> | ||
| <p> | ||
| Pink Flower Tree | ||
| </p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- discount --> | ||
| <div class="discount-container"> | ||
| <div class="discount-text"> | ||
| <h1>Hot Deal ! Sale Up To 25% <span class="off">Off</span></h1> | ||
| <p> | ||
| It is a long established fact that a reader will be distracted by | ||
| the readable <br />content of a page when looking at its layout. | ||
| </p> | ||
| <button type="button" class="btn">Sign UP</button> | ||
| </div> | ||
| <div class="discount-image"> | ||
| <img | ||
| src="flower-shop-assignment-main/Flower Asset/pngwing 8.png" | ||
| alt="" | ||
| /> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Instagram --> | ||
| <div class="instagram"> | ||
| <h1>Instagram</h1> | ||
| <p> | ||
| It is a long established fact that a reader will be distracted by the | ||
| readable <br />content of a page when looking at its layout. | ||
| </p> | ||
| </div> | ||
| <!-- instagram gallery --> | ||
| <div class="image-gallery"> | ||
| <div> | ||
| <img | ||
| src="flower-shop-assignment-main/Flower Asset/Flower 01.png" | ||
| alt="" | ||
| /> | ||
| </div> | ||
| <div> | ||
| <img | ||
| src="flower-shop-assignment-main/Flower Asset/Rectangle 4.png" | ||
| alt="" | ||
| /> | ||
| </div> | ||
| <div> | ||
| <img | ||
| src="flower-shop-assignment-main/Flower Asset/Rectangle 5.png" | ||
| alt="" | ||
| /> | ||
| </div> | ||
| <div> | ||
| <img | ||
| src="flower-shop-assignment-main/Flower Asset/Rectangle 6.png" | ||
| alt="" | ||
| /> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Email form --> | ||
| <div class="subscribe"> | ||
| <div> | ||
| <h1>Get The Latest Deals</h1> | ||
| <p>$30 coupon for first shopping</p> | ||
| </div> | ||
| <div> | ||
| <form action=""> | ||
| <input | ||
| type="text" | ||
| name="" | ||
| id="input" | ||
| placeholder="Enter you email" | ||
| /> | ||
| <button class="btn">Subscribe</button> | ||
| </form> | ||
| </div> | ||
| <div></div> | ||
| </div> | ||
|
|
||
| <!-- Email form --> | ||
| <div class="subscribe"> | ||
| <div> | ||
| <!-- article container --> | ||
| <div class="article-container"> | ||
| <div class="left-blog"> | ||
| <h1> | ||
| Get The Latest Deals | ||
| Flower Flourish | ||
| </h1> | ||
| <p> | ||
| $30 coupon for first shopping | ||
| </p> | ||
| </div> | ||
| <div> | ||
| <form action=""> | ||
| <input type="text" name="" id="input" placeholder="Enter you email" > | ||
| <button class="btn">Subscribe</button> | ||
| </form> | ||
| <p> | ||
| Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magni id tenetur, quo quos provident | ||
| <br> ratione ab, quam repellendus, dolore voluptatem perspiciatis soluta accusamus at saepe quod numquam. | ||
| <br> Voluptatibus autem harum, laborum totam nulla a labore eum ab impedit rerum inventore maiores quod adipisci molestiae ea, voluptate tenetur! Id, totam repudiandae. | ||
| </p> | ||
|
|
||
| <p> | ||
| Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magni id tenetur, <br> quo quos provident ratione ab, quam repellendus, dolore voluptatem perspiciatis soluta accusamus at saepe quod numquam. Voluptatibus autem harum, laborum totam nulla a labore eum ab impedit rerum inventore maiores quod adipisci molestiae ea, voluptate tenetur! Id, totam repudiandae. | ||
| </p> | ||
| </div> | ||
| <div> | ||
|
|
||
| </div> | ||
| </div> | ||
| </main> | ||
| <div class="blog-img"> | ||
| <img src="flower-shop-assignment-main/Flower Asset/pngwing 6.png" alt=""> | ||
| </div> | ||
|
|
||
| <!-- Footer section Started --> | ||
| <footer> | ||
| <h1> | ||
| <span class="off">Flower</span>Shop | ||
| </h1> | ||
| <p> | ||
| It is a long established fact that a reader will be distracted by the readable <br> 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> | ||
| </div> | ||
|
|
||
| </main> | ||
|
|
||
| <!-- Footer section Started --> | ||
| <footer> | ||
| <h1><span class="off">Flower</span>Shop</h1> | ||
| <p> | ||
| It is a long established fact that a reader will be distracted by the | ||
| readable <br /> | ||
| 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> |
Oops, something went wrong.