Contenu du cours
Essentiels de Bootstrap pour les Sites Web Modernes
Essentiels de Bootstrap pour les Sites Web Modernes
2. Configuration de l'Environnement
4. Concepts Avancés
Implémentation du Formulaire de Contact
1. Ajouter la section du formulaire de contact
Créez une section en bas de la page pour accueillir le formulaire de contact.
<section id="contact" class="contact-section py-5 bg-secondary">
<div class="container">
<div class="row">
<div class="col-md-8 mx-auto">
<h2 class="text-center mb-4 text-light">Contact Me</h2>
<!-- Add the contact form here -->
<form>
<div class="mb-3">
<label for="name" class="form-label text-light">Name</label>
<input
type="text"
class="form-control"
id="name"
placeholder="Enter your name"
/>
</div>
<div class="mb-3">
<label for="email" class="form-label text-light">Email</label>
<input
type="email"
class="form-control"
id="email"
placeholder="Enter your email"
/>
</div>
<div class="mb-3">
<label for="message" class="form-label text-light">Message</label>
<textarea
class="form-control"
id="message"
rows="5"
placeholder="Enter your message"
></textarea>
</div>
<button type="submit" class="btn btn-warning">Submit</button>
</form>
</div>
</div>
</div>
</section>
2. Créer le formulaire de contact
Dans le formulaire, utilisez les composants de formulaire de Bootstrap pour créer des champs de saisie pour le nom, l'email, le message, etc. Personnalisez les étiquettes du formulaire, les espaces réservés et le texte du bouton selon les besoins.
Résultat
index.html
Tout était clair ?
Merci pour vos commentaires !
Section 5. Chapitre 7