HTML Code for Restaurant Website
Creating an entire responsive restaurant website involves several files, including HTML, CSS, and possibly JavaScript. Below is a simple example of HTML code for a restaurant website. Keep in mind that this is a basic template, and you might want to customize it further based on your specific needs.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Restaurant Name</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
box-sizing: border-box;
}
header {
background-color: #333;
color: #fff;
padding: 1em;
text-align: center;
}
nav {
background-color: #444;
color: #fff;
text-align: center;
padding: 1em;
}
section {
padding: 1em;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 1em;
}
@media (max-width: 600px) {
nav {
flex-direction: column;
}
}
</style>
</head>
<body>
<header>
<h1>Restaurant Name</h1>
</header>
<nav>
<a href="#">Home</a>
<a href="#">Menu</a>
<a href="#">About Us</a>
<a href="#">Contact</a>
</nav>
<section>
<h2>Welcome to Our Restaurant</h2>
<p>Discover the finest dining experience with our delicious dishes.</p>
<img src="restaurant-image.jpg" alt="Restaurant Image" style="max-width: 100%; height: auto;">
</section>
<section>
<h2>Our Menu</h2>
<p>Explore our diverse menu offering a range of exquisite dishes.</p>
<!-- Include menu items here -->
</section>
<section>
<h2>About Us</h2>
<p>Learn about our history, mission, and commitment to quality.</p>
</section>
<footer>
<p>© 2024 Restaurant Name. All rights reserved.</p>
</footer>
</body>
</html>
Please note: that you'll need to replace the placeholder content and images with your actual content. Additionally, you may want to add more sections, styling, and interactive features based on your specific requirements.
Post a Comment