noturavgcoder
commented
2 days ago
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mobile Store</title>
</head>
<body>
<!-- Header Section -->
<header>
<h1>Mobile Store</h1>
<nav>
<a href="#home">Home</a> |
<a href="#shop">Shop</a> |
<a href="#contact">Contact</a> |
<a href="#about">About</a>
</nav>
</header>
<!-- Main Content -->
<main>
<section class="product-grid">
<!-- Product Card 1 -->
<div class="product-card">
<img src="phone1.jpg" alt="Phone 1">
<h2>Phone Model 1</h2>
<p>High-quality smartphone with advanced features.</p>
<p class="price">$499</p>
<button>Add to Cart</button>
</div>
<!-- Product Card 2 -->
<div class="product-card">
<img src="phone2.jpg" alt="Phone 2">
<h2>Phone Model 2</h2>
<p>Feature-packed phone with excellent performance.</p>
<p class="price">$599</p>
<button>Add to Cart</button>
</div>
<!-- Product Card 3 -->
<div class="product-card">
<img src="phone3.jpg" alt="Phone 3">
<h2>Phone Model 3</h2>
<p>Budget-friendly phone for everyday use.</p>
<p class="price">$299</p>
<button>Add to Cart</button>
</div>
</section>
</main>
<!-- Footer Section -->
<footer>
<p>© 2024 Mobile Store. All rights reserved.</p>
</footer>
</body>
</html>
Style CSS.zip