0% found this document useful (0 votes)
24 views

Code

The document is the code for an e-commerce website. It includes the header, navigation menu, product images and descriptions. There are sections for featured products, product categories and a footer with social media links.

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
0% found this document useful (0 votes)
24 views

Code

The document is the code for an e-commerce website. It includes the header, navigation menu, product images and descriptions. There are sections for featured products, product categories and a footer with social media links.

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>

<link rel="stylesheet" href="./ecommerce.css">


<link href="https://unpkg.com/[email protected]/dist/css/ionicons.min.css"
rel="stylesheet">
</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">$5</div>
<div class="info">Lorem ipsum dolor sit amet consectetur.</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">$6.34</div>
<div class="info">Lorem ipsum dolor sit.</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">$9</div>
<div class="info">Lorem ipsum dolor sit amet.</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">$9.1</div>
<div class="info">Lorem ipsum dolor sit.</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">$20</div>
<div class="info">Lorem ipsum dolor sit.</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">$18</div>
<div class="info">Lorem ipsum dolor sit amet consectetur.</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">$6.7</div>
<div class="info">Lorem ipsum dolor sit.</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">$10</div>
<div class="info">Lorem ipsum dolor sit amet consectetur adipisicing
elit.</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">$9.9</div>
<div class="info">Lorem ipsum dolor sit amet consectetur
adipisicing.</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">$99</div>
<div class="info">Lorem ipsum dolor sit amet consectetur, adipisicing
elit.</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">$30</div>
<div class="info">Lorem ipsum dolor sit amet consectetur, adipisicing
elit.</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">$29.7</div>
<div class="info">Lorem ipsum dolor sit amet consectetur, adipisicing
elit.</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">$100</div>
<div class="info">Lorem ipsum dolor sit amet consectetur, adipisicing
elit.</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">$78</div>
<div class="info">Lorem ipsum dolor sit amet consectetur, adipisicing
elit.</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">$9</div>
<div class="info">Lorem ipsum dolor sit amet consectetur, adipisicing
elit.</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">$36.5</div>
<div class="info">Lorem ipsum dolor sit amet consectetur, adipisicing
elit.</div>
</div>
<div class="items">
<div class="img img1"><img
src="https://media.istockphoto.com/photos/hand-of-a-lady-selecting-yellow-colored-
saree-in-a-shop-picture-id1301740530" alt=""></div>
<div class="name">SAREES</div>
<div class="price">$25.6</div>
<div class="info">Lorem ipsum dolor sit amet consectetur, adipisicing
elit.</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">rs5556</div>
<div class="info">good quality products.</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