Untitled

avatar
unknown
plain_text
3 years ago
2.2 kB
8
Indexable
<!DOCTYPE html>
<html>
<head>
	<title>Clothing Store</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<header>
		<h1>Clothing Store</h1>
		<nav>
			<ul>
				<li><a href="#">Home</a></li>
				<li><a href="#">Men</a></li>
				<li><a href="#">Women</a></li>
				<li><a href="#">Kids</a></li>
				<li><a href="#">Contact Us</a></li>
			</ul>
		</nav>
	</header>
	<main>
		<section id="featured-products">
			<h2>Featured Products</h2>
			<div class="product">
				<img src="product1.jpg" alt="Product 1">
				<h3>Product 1</h3>
				<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id sodales libero. Donec nec mi sit amet urna euismod dictum.</p>
				<a href="#" class="button">Buy Now</a>
			</div>
			<div class="product">
				<img src="product2.jpg" alt="Product 2">
				<h3>Product 2</h3>
				<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id sodales libero. Donec nec mi sit amet urna euismod dictum.</p>
				<a href="#" class="button">Buy Now</a>
			 </div>
			<div class="product">
				<img src="product3.jpg" alt="Product 3">
				<h3>Product 3</h3>
				<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id sodales libero. Donec nec mi sit amet urna euismod dictum.</p>
				<a href="#" class="button">Buy Now</a>
			</div>
		</section>
		<section id="about-us">
			<h2>About Us</h2>
			<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id sodales libero. Donec nec mi sit amet urna euismod dictum.</p>
		</section>
	</main>
	<footer>
		<p>&copy; 2023 Clothing Store. All rights reserved.</p>
	</footer>
</body>
</html>
/* Global Styles */
body {
	margin: 0;
	padding: 0;
	font-family: Arial, sans-serif;
}

a {
	text-decoration: none;
	color: #333;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Header Styles */
header {
	background-color: #F2F2F2;
	padding: 20px;
}

h1 {
	margin: 0;
}

nav ul {
	float: right;
}

nav ul li {
	float: left;
	margin-left: 20px;
}

nav ul li a:hover {
	color: #E64A19;
}

/* Main Content Styles */
main {
	padding: 20px;
}

section {
	margin-bottom: 20px;
}

.product {
	border: 1px solid #E6E6E6;
	padding: 20px;
	float: left;
	width: 30%;
	margin-right:
Editor is loading...