Bootstrap: Contact Form Exercise

The goal of this exercise is to use the CSS components you've learned so far from Bootstrap to create a contact form for your website.

Part 1: Setup

1. Make a copy of your index.html from the previous exercise.
2. Name it contact.html and save it in the same folder as your index.html.
3. Delete the main content from contact.html, but keep the header, navigation, and footer if you have it.
4. Paste this starter code into your contact.html instead.

Part 2: Create form!

Add input fields

• Use the form control classes such as .form-group and .form-control to style your Name, Email, Subject, and Message fields.
• Use the button component's .btn classes to style your Send button.

Bonus

• Add a header and introductory text to your Contact page.
• Use the grid classes we have already learned to style/position your new content on the page.

Show Solution