Scribd
Upload
8 views15 pages

CODE

The document contains HTML and CSS code for a restaurant website, featuring a menu section with various food items and a contact form for customer inquiries. The menu items include descriptions and prices, styled with CSS for an appealing layout. The contact form allows users to submit their name, email, subject, and message, ensuring a user-friendly experience.

Uploaded by

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

CODE

The document contains HTML and CSS code for a restaurant website, featuring a menu section with various food items and a contact form for customer inquiries. The menu items include descriptions and prices, styled with CSS for an appealing layout. The contact form allows users to submit their name, email, subject, and message, ensuring a user-friendly experience.

Uploaded by

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

CODE-HTML

CODE-CSS
CODE-HTML
CODE-CSS
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-image: URL(BGIMAGE.jpg);
color: #333;
}
header {
background-image: url(https://www.scribd.com/BGIMAGE.jpg);
color:white;
text-align: center;
padding: 1em 0;
}
.menu {
max-width: 800px;
margin: 20px auto;
background: white;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
padding: 20px;
}
.menu-section {
margin-bottom: 30px;
}
.menu-section h2 {
border-bottom: 2px solid #d9534f;
padding-bottom: 5px;
color: #d9534f;
}
.menu-item {
display: flex;
justify-content: space-between;
padding: 10px 0;
border-bottom: 1px solid #ddd;
}
.menu-item:last-child {
border-bottom: none;
}
.menu-item .name {
font-weight: bold;
}
.menu-item .description {
font-size: 0.9em;
color: #666;
}
.menu-item .price {
font-weight: bold;
color: #d9534f;
}
CODE-HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Restaurant</title>
<link rel="stylesheet" href="services.css">
</head>
<body>
<header>
<h1>Welcome to Spice Symphony</h1>
<p>Delicious food delivered to your doorstep!</p>
</header>
<Div id="menu" class="menu">
<div class="menu-item">
<img src="tikka.jpg">
<h3>Paneer Tikka</h3>
<p>Spiced and grilled cottage cheese cubes.</p>
<p>Price:₹250 </p>
<button>Order Now</button>
</div>
<div class="menu-item">
<img SRC="CHICKEN.jpg">
<h3>Chicken Tikka</h3>
<p>Marinated chicken grilled to perfection.</p>
<p>Price: ₹300</p>
<button>Order Now</button>
</div>
<div class="menu-item">
<img src="burger.jpg">
<h3>Burger</h3>
<p>Buns with delicious patty inside</p>
<p>Price: ₹100</p>
<button>Order Now</button>
</div>
</div>
<Div id="menu" class="menu">
<div class="menu-item">
<img src="butterchicken.jpg">
<h3>Butter Chicken</h3>
<p>Creamy tomato-based chicken curry.</p>
<p>Price:₹400 </p>
<button>Order Now</button>
</div>
<div class="menu-item">
<img SRC="paneerbutter.jpg">
<h3>Paneer Butter Masala</h3>
<p>Rich and creamy paneer curry.</p>
<p>Price: ₹350</p>
<button>Order Now</button>
</div>
<div class="menu-item">
<img src="noodles.jpg">
<h3>Veg Noodles</h3>
<p>A stir fried noodle dish made with veggies and seasoned with
ginger, garlic, celery, pepper, soy sauce</p>
<p>Price: ₹200</p>
<button>Order Now</button>
</div>
</div>
<Div id="menu" class="menu">
<div class="menu-item">
<img src="naan.jpg">
<h3>Garlic Naan</h3>
<p>Soft naan bread with a garlic topping.</p>
<p>Price:₹90 </p>
<button>Order Now</button>
</div>
<div class="menu-item">
<img SRC="roti.jpg">
<h3>Butter Roti</h3>
<p>Soft bread with a butter topping.</p>
<p>Price: ₹50</p>
<button>Order Now</button>
</div>
<div class="menu-item">
<img src="paratha.jpg">
<h3>Lacchha Paratha</h3>
<p>A multi-layered Indian flatbread that originated in the Punjab
region</p>
<p>Price: ₹80</p>
<button>Order Now</button>
</div>
</div>

</body>
</html>
CODE-CSS
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-image: url(https://www.scribd.com/service.jpg);
}
header {
background-image: url(https://www.scribd.com/service.jpg);
color: white;
padding: 15px;
text-align: center;
}

.menu {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 20px;
}
.menu-item {
border: 1px solid #ddd;
border-radius: 8px;
margin: 10px;
padding: 15px;
width: 300px;
background-color: white;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
text-align: center;
}
.menu-item img {
max-width: 100%;
height: auto;
border-radius: 5px;
}
.menu-item h3 {
margin: 10px 0;
}
.menu-item p {
margin: 5px 0;
color: #555;
}
.menu-item button {
background-color: #ff6347;
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
}
.menu-item button:hover {
background-color: #e5533d;
CODE-HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contact Us - Restaurant</title>
<link rel="stylesheet" href="contact.css">
</head>
<body>
<div class="container">
<h1>Contact Us</h1>
<p>If you have any questions, queries, or complaints, please fill out
the form below. We'll get back to you as soon as possible.</p>
<form action="/submit" method="post">
<label for="name">Your Name:</label>
<input type="text" id="name" name="name" placeholder="Enter your
name" required>

<label for="email">Your Email:</label>


<input type="email" id="email" name="email" placeholder="Enter
your email" required>

<label for="subject">Subject:</label>
<select id="subject" name="subject" required>
<option value="query">Query</option>
<option value="request">Request</option>
<option value="complaint">Complaint</option>
</select>

<label for="message">Message:</label>
<textarea id="message" name="message" rows="5" placeholder="Write
your message here..." required></textarea>

<button type="submit">Submit</button>
</form>
<p class="note">* All fields are required.</p>
</div>
</body>
</html>
CODE-CSS
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-image: url(https://www.scribd.com/contact.jpg);
color: #333;
}

.container {
max-width: 800px;
margin: 50px auto;
background: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

h1 {
text-align: center;
color: #444;
}

form {
display: flex;
flex-direction: column;
}

label {
margin-top: 10px;
font-weight: bold;
}

input, textarea, select, button {


margin-top: 5px;
padding: 10px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 4px;
}

textarea {
resize: vertical;
}
button {
background-color: #5cb85c;
color: white;
border: none;
cursor: pointer;
margin-top: 15px;
}

button:hover {
background-color: #4cae4c;
}

.note {
font-size: 14px;
color: #888;
}

You might also like