<!DOCTYPE html>
<html lang= »fr »>
<head>
<meta charset= »UTF-8″>
<title>Formulaire de Contact</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
padding: 30px;
}

.contact-form {
background: #fff;
padding: 20px 30px;
border-radius: 8px;
max-width: 600px;
margin: 0 auto;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.contact-form h2 {
text-align: center;
margin-bottom: 20px;
}

.form-group {
margin-bottom: 15px;
}

.form-group label {
display: block;
margin-bottom: 5px;
font-weight: bold;
}

.form-group input,
.form-group textarea {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}

.form-group textarea {
height: 120px;
resize: vertical;
}

.form-group input[type= »file »] {
border: none;
padding: 0;
}

.submit-btn {
background-color: #007BFF;
color: white;
padding: 12px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
width: 100%;
font-size: 16px;
}

.submit-btn:hover {
background-color: #0056b3;
}
</style>
</head>
<body>

<form class= »contact-form » action= »# » method= »post » enctype= »multipart/form-data »>
<h2>Formulaire de Contact</h2>

<div class= »form-group »>
<label for= »nom »>Nom :</label>
<input type= »text » id= »nom » name= »nom » required>
</div>

<div class= »form-group »>
<label for= »prenom »>Prénom :</label>
<input type= »text » id= »prenom » name= »prenom » required>
</div>

<div class= »form-group »>
<label for= »email »>Adresse e-Mail :</label>
<input type= »email » id= »email » name= »email » required>
</div>

<div class= »form-group »>
<label for= »adresse »>Adresse complète :</label>
<input type= »text » id= »adresse » name= »adresse » required>
</div>

<div class= »form-group »>
<label for= »message »>Message :</label>
<textarea id= »message » name= »message » required></textarea>
</div>

<div class= »form-group »>
<label for= »fichier »>Joindre un fichier (.jpg, .pdf) :</label>
<input type= »file » id= »fichier » name= »fichier » accept= ».jpg,.jpeg,.pdf »>
</div>

<button type= »submit » class= »submit-btn »>Envoyez</button>
</form>

</body>
</html>