Scribd
Upload
28 views7 pages

DOCTYPE HTML WPS Office

The document contains HTML code for an online store selling various products like shoes and clothing. It displays products in a grid layout with images, names, prices and 'Add to Cart' buttons. There are multiple pages shown for different stores.

Uploaded by

glenn0805
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
28 views7 pages

DOCTYPE HTML WPS Office

The document contains HTML code for an online store selling various products like shoes and clothing. It displays products in a grid layout with images, names, prices and 'Add to Cart' buttons. There are multiple pages shown for different stores.

Uploaded by

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

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aiya's Store</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
.container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.product {
border: 1px solid #ccc;
padding: 10px;
margin-bottom: 20px;
border-radius: 8px;
overflow: hidden;
}
.product img {
max-width: 100%;
border-radius: 8px;
}
.product h2 {
margin-top: 0;
font-size: 20px;
}
.product p {
margin-bottom: 0;
}
.price {
font-weight: bold;
color: green;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
cursor: pointer;
border-radius: 4px;
float: right;
}
button:hover {
background-color: #45a049;
}
</style>
</head>
<body>
<header>
<h1></h1>
</header>
<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/Picsart_24-05-14_14-34-34-535.jpg"">
<h2></h2>
<p>Converse Chuck Taylor All Star Black</p>
<p class="price">₱599</p>
<button>Add to Cart </button>
</div

<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/c92548396e2d1c985224c163eb78f852.jpg"">
<h2></h2>
<p>Breakj Platform Summer Shoes</p>
<p class="price">₱499</p>
<button>Add to Cart </button>
</div
<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/5b8aca06f7182e3e75b7c4f150aab15c.jpg"">
<h2></h2>
<p>Women's Chunky Sneakers</p>
<p class="price">₱399</p>
<button>Add to Cart </button>
</div

<
<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/34c9d89ede956af4befd2c765e086dbf.jpg"">
<h2></h2>
<p>Breakj Lolita shoes new pink platform sneakers sweet purple </p>
<p class="price">₱499</p>
<button>Add to Cart </button>
</div

<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/72770d539df726a8bf7dd74a3d63d445.jpg"">
<h2></h2>
<p>Bubble Gum Pink Custom Air Force 1 Sneakers Low/Mid/High</p>
<p class="price">₱399</p>
<button>Add to Cart </button>
</div
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>France Store</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
.container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.product {
border: 1px solid #ccc;
padding: 10px;
margin-bottom: 20px;
border-radius: 8px;
overflow: hidden;
}
.product img {
max-width: 100%;
border-radius: 8px;
}
.product h2 {
margin-top: 0;
font-size: 20px;
}
.product p {
margin-bottom: 0;
}
.price {
font-weight: bold;
color: green;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
cursor: pointer;
border-radius: 4px;
float: right;
}
button:hover {
background-color: #45a049;
}
</style>
</head>
<body>
<header>
<h1></h1>
</header>
<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/5c788817a4616160ef7ca8b91bbd40ee.jpg"">
<h2></h2>
<p>American Casual Large 2XL Hoodies</p>
<p class="price">₱680</p>
<button>Add to Cart </button>
</div

<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/91f60179372ba016f6291ad42d1a9273.jpg"">
<h2></h2>
<p>Trendy Duo Delight: American Vintage Thin Sweater </p>
<p class="price">₱590</p>
<button>Add to Cart </button>
</div

<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/baaa2cf1a93b1fca79d34c1ddf4db733.jpg"">
<h2></h2>
<p>Couple Embroidered Space Rocket and Moon Hoodies</p>
<p class="price">₱360</p>
<button>Add to Cart </button>
</div

<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/6651eb222d318ab3b0b2f4b594e3c787.jpg"">
<h2></h2>
<p>Bear Hoodie For Womens Autumn Patchwork Sweatshirts Long Womens Zippered Hoodies</p>
<p class="price">₱350</p>
<button>Add to Cart </button>
</div

<div class="container">
<div class="product">
<img src="/storage/emulated/0/SHAREit/pictures/4220ccc1e4b11760fd88ac777f064a3f.jpg"">
<h2></h2>
<p>Shark Print Drawstring Hoodie, Casual long Sleeve Kangaroo Pocket Hoodie Sweatshirt</p>
<p class="price">₱500</p>
<button>Add to Cart </button>
</div

You might also like