Scribd
Upload
7 views

Assignment 4

Uploaded by

alokpal2803
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
7 views

Assignment 4

Uploaded by

alokpal2803
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

Alok Kumar Pal

2300290110023

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Contact Form</title>

<style>

body {

font-family: Arial, sans-serif;

line-height: 1.6;

margin: 0;

padding: 0;

background-color: #f4f4f4;

header {

background: #007BFF;

color: white;

padding: 20px;

text-align: center;

h1 {

margin: 0;

main {

max-width: 800px;

margin: 20px auto;

padding: 20px;

background: rgb(255, 255, 255);


Alok Kumar Pal
2300290110023

box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

form {

display: flex;

flex-direction: column;

label {

margin: 10px 0 5px;

input {

padding: 10px;

border: 1px solid #ccc;

border-radius: 5px;

input, textarea {

width: 97%;

padding: 10px;

margin: 8px 0;

border-radius: 5px;

border: 1px solid #ddd;

box-shadow: 0 2px 5px #8888;

button {

margin-top: 10px;

padding: 10px;

background: #28a745;

color: white;
Alok Kumar Pal
2300290110023

border: none;

border-radius: 5px;

cursor: pointer;

button:hover {

background: #218838;

footer {

text-align: center;

padding: 20px;

background: #007BFF;

color: white;

</style>

</head>

<body>

<header>

<h1>Contact Form</h1>

</header>

<main>

<form action="#" method="post">

<label for="name">Name:</label>

<input type="text" id="name" name="name" required>

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

<input type="email" id="email" name="email" required>

<label for="phone">Phone:</label>

<input type="tel" id="phone" name="phone" required><br>


Alok Kumar Pal
2300290110023

<label for="Message">Message:</label>

<textarea name="message" required id=""></textarea><br>

<button type="submit">Submit</button>

</form>

</main>

<footer>

<p>&copy; 2024 Contact Form. All rights reserved.</p>

</footer>

</body>

</html>

You might also like