Untitled

mail@pastecode.io avatar
unknown
plain_text
a year ago
1.5 kB
3
Indexable
Never
<!DOCTYPE html>
<html>
<head>
	<title>Shoe Store</title>
	<style>
		body {
			background-color: #F2F2F2;
			font-family: Arial, sans-serif;
		}
		.header {
			background-color: #333333;
			color: #FFFFFF;
			padding: 20px;
			text-align: center;
		}
		.header h1 {
			margin: 0;
		}
		.shoe-display {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			margin: 20px;
		}
		.shoe-card {
			background-color: #FFFFFF;
			border: 1px solid #E5E5E5;
			box-shadow: 2px 2px 5px #E5E5E5;
			width: 30%;
			margin-bottom: 20px;
			text-align: center;
		}
		.shoe-card img {
			width: 100%;
			height: 200px;
			object-fit: cover;
		}
		.shoe-card h2 {
			margin: 20px 0;
		}
		.shoe-card p {
			margin: 0;
			padding: 20px;
			font-size: 14px;
			color: #666666;
		}
		.shoe-card button {
			background-color: #333333;
			color: #FFFFFF;
			border: none;
			padding: 10px 20px;
			cursor: pointer;
			margin: 20px 0;
		}
	</style>
</head>
<body>
	<div class="header">
		<h1>Shoe Store</h1>
	</div>
	<div class="shoe-display">
		<div class="shoe-card">
			<img src="https://via.placeholder.com/300x200" alt="Shoe 1">
			<h2>Shoe 1</h2>
			<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sollicitudin metus quis lectus pretium, et ullamcorper magna tempor. </p>
			<button>Add to Cart</button>
		</div>
		<div class="shoe-card">
			<img src="https://via.placeholder.com/300x200" alt="Shoe 2">
			<h2>Shoe 2</h2>
			<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer so