Scribd
Upload
15 views5 pages

Proj 1

The document describes an e-commerce website with sections for header, homepage content, products and footer. The header includes logo, menus and search. The homepage features image slider and product listings. The footer contains social media links, product/service categories and company information.

Uploaded by

ncer.fe.b2023
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
15 views5 pages

Proj 1

The document describes an e-commerce website with sections for header, homepage content, products and footer. The header includes logo, menus and search. The homepage features image slider and product listings. The footer contains social media links, product/service categories and company information.

Uploaded by

ncer.fe.b2023
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 5

</head>

<body>
<header>
<div class="logo"><a href="#">ShoPperZ</a></div>
<div class="menu">
<a href="#">
<ion-icon name="close" class="close"></ion-icon>
</a>

<ul>
<li><a href="#" class="under">HOME</a></li>
<li><a href="#" class="under">SHOP</a></li>
<li><a href="#" class="under">OUR PRODUCTS</a></li>
<li><a href="#" class="under">CONTACT US</a></li>
<li><a href="#" class="under">ABOUT US</a></li>
</ul>
</div>
<div class="search">

<a href=""><input type="text" placeholder="search products" id="input">


<ion-icon class="s" name="search"></ion-icon>
</a>
</div>
<div class="heading">
<ul>
<li><a href="#" class="under">HOME</a></li>
<li><a href="#" class="under">SHOP</a></li>
<li><a href="#" class="under">OUR PRODUCTS</a></li>
<li><a href="#" class="under">CONTACT US</a></li>
<li><a href="#" class="under">ABOUT US</a></li>
</ul>
</div>
<div class="heading1">
<ion-icon name="menu" class="ham"></ion-icon>
</div>
</header>
<section>
<div class="section">
<div class="section1">
<div class="img-slider">
<img src="https://images.pexels.com/photos/6347888/pexels-photo-
6347888.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260" alt="" class="img">
<img src="https://images.pexels.com/photos/3962294/pexels-photo-
3962294.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260" alt="" class="img">
<img src="https://images.pexels.com/photos/2292953/pexels-photo-
2292953.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500" alt="" class="img">
<img src="https://images.pexels.com/photos/1229861/pexels-photo-
1229861.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260" alt="" class="img">
<img src="https://images.pexels.com/photos/1598505/pexels-photo-
1598505.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260" alt="" class="img">
</div>

</div>
<div class="section2">
<div class="container">
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/1464625/pexels-photo-1464625.jpeg?
auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt=""></div>
<div class="name">SHOES</div>
<div class="price">rs500</div>
<div class="info">various snickers combo</div>
</div>
<div class="items">
<div class="img img2"><img
src="https://images.pexels.com/photos/3649765/pexels-photo-3649765.jpeg?
auto=compress&cs=tinysrgb&dpr=1&w=500" alt=""></div>
<div class="name">MEN's T-SHIRT</div>
<div class="price">rs500</div>
<div class="info">cotton king shirts.</div>
</div>
<div class="items">
<div class="img img3"><img
src="https://media.istockphoto.com/photos/folded-blue-jeans-on-a-white-background-
modern-casual-clothing-flat-picture-id1281304280" alt=""></div>
<div class="name">JEANS</div>
<div class="price">rs700</div>
<div class="info">branded jeans .</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/8839887/pexels-photo-8839887.jpeg?
auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt=""></div>
<div class="name">WATCH</div>
<div class="price">rs500</div>
<div class="info">durable watchs.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/6858618/pexels-photo-6858618.jpeg?
auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt=""></div>
<div class="name">SMART PHONE</div>
<div class="price">rs7000</div>
<div class="info">cheapest phones.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/5552789/pexels-photo-5552789.jpeg?
auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt=""></div>
<div class="name">TELEVISION</div>
<div class="price">rs3500</div>
<div class="info">colourfull screen.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/4295985/pexels-photo-4295985.jpeg?
auto=compress&cs=tinysrgb&dpr=1&w=500" alt=""></div>
<div class="name">HOODIES</div>
<div class="price">rs500</div>
<div class="info">comfortable in winter.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://media.istockphoto.com/photos/vintage-plates-with-silver-teaspoons-
picture-id184363070" alt=""></div>
<div class="name">DINNER SET</div>
<div class="price">rs2000</div>
<div class="info">soo strong material.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/6463348/pexels-photo-6463348.jpeg?
auto=compress&cs=tinysrgb&dpr=1&w=500" alt=""></div>
<div class="name">BLANKETS</div>
<div class="price">rs300</div>
<div class="info">colourfull designs.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/2659939/pexels-photo-2659939.jpeg?
auto=compress&cs=tinysrgb&dpr=1&w=500" alt=""></div>
<div class="name">LAPTOP</div>
<div class="price">rs25000</div>
<div class="info">new laptops with windows 11.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://media.istockphoto.com/photos/modern-kitchen-microwave-oven-picture-
id1144960519" alt=""></div>
<div class="name">MICROWAVE</div>
<div class="price">rs300</div>
<div class="info">good quality</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://media.istockphoto.com/photos/black-coffee-maker-with-green-led-lights-
picture-id177395430" alt=""></div>
<div class="name">COFFEE MAKER</div>
<div class="price">rs600</div>
<div class="info">sweet coffies.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/6606354/pexels-photo-6606354.jpeg?
auto=compress&cs=tinysrgb&dpr=1&w=500" alt=""></div>
<div class="name">BED</div>
<div class="price">rs7000</div>
<div class="info">comfortable for deep sleep.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://media.istockphoto.com/photos/woman-turning-on-air-conditioner-picture-
id1325708905" alt=""></div>
<div class="name">AIR CONDITIONER</div>
<div class="price">10000</div>
<div class="info">adjust temperature.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/5834/nature-grass-leaf-green.jpg?
auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt=""></div>
<div class="name">BOOK</div>
<div class="price">rs300</div>
<div class="info">improve your knowledge.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/4339598/pexels-photo-4339598.jpeg?
auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt=""></div>
<div class="name">BAG</div>
<div class="price">rs700</div>
<div class="info">new fashion bags.</div>
</div>

<div class="items">
<div class="img img1"><img
src="https://images.pexels.com/photos/5816934/pexels-photo-5816934.jpeg?
auto=compress&cs=tinysrgb&dpr=2&h=650&w=940" alt=""></div>
<div class="name">WASHING MACHINE</div>
<div class="price">rs50403</div>
<div class="info">goodquality machines.</div>
</div>
</div>

</div>
</div>

</section>
<footer>
<div class="footer0">
<h1>ShoPperZ</h1>
</div>
<div class="footer1 ">
Connect with us at<div class="social-media">
<a href="#">
<ion-icon name="logo-facebook"></ion-icon>
</a>
<a href="#">
<ion-icon name="logo-linkedin"></ion-icon>
</a>
<a href="#">
<ion-icon name="logo-youtube"></ion-icon>
</a>
<a href="#">
<ion-icon name="logo-instagram"></ion-icon>
</a>
<a href="#">
<ion-icon name="logo-twitter"></ion-icon>
</a>
</div>
</div>
<div class="footer2">
<div class="product">
<div class="heading">Products</div>
<div class="div">Sell your Products</div>
<div class="div">Advertise</div>
<div class="div">Pricing</div>
<div class="div">Product Buisness</div>

</div>
<div class="services">
<div class="heading">Services</div>
<div class="div">Return</div>
<div class="div">Cash Back</div>
<div class="div">Affiliate Marketing</div>
<div class="div">Others</div>
</div>
<div class="Company">
<div class="heading">Company</div>
<div class="div">Complaint</div>
<div class="div">Careers</div>
<div class="div">Affiliate Marketing</div>
<div class="div">Support</div>
</div>
<div class="Get Help">
<div class="heading">Get Help</div>
<div class="div">Help Center</div>
<div class="div">Privacy Policy</div>
<div class="div">Terms</div>
<div class="div">Login</div>
</div>
</div>
<div class="footer3">Copyright © <h4>ShoPperZ</h4> 2021-2028</div>
</footer>
<script src="https://unpkg.com/[email protected]/dist/ionicons.js"></script>
<script src="./ecommerce.js"></script>

</body>

</html>

You might also like