Don't forget to hit the ⭐ if you like this repo.
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.
- Make a copy of your
index.html
from the previous exercise. - Name it
contact.html
and save it in the same folder as yourindex.html
. - Delete the main content from
contact.html
, but keep the header, navigation, and footer if you have it. - Paste this starter code into your
contact.html
instead.
- Use the (form control)[https://getbootstrap.com/docs/5.3/forms/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. - When the form submits, have it send to your own email? (Hint: how does the form know which email to send to?)
- 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.
- This task must be done in groups (4 people per group).
- Please provide your contact information in the HTML
<head>
.
<!--
Lab XX: XXX
Group:
1. Name: [Name], Matrix No: [Matrix Number], Github ID: [Github ID]
2. Name: [Name], Matrix No: [Matrix Number], Github ID: [Github ID]
3. Name: [Name], Matrix No: [Matrix Number], Github ID: [Github ID]
4. Name: [Name], Matrix No: [Matrix Number], Github ID: [Github ID]
-->
- You must place your file in the submission folder. Within the submission folder, create a folder named after your group.
Example: /submission/[group-name]/[your-file]
(Note: please replace [Name], [Matrix Number], [Github ID], [group-name], and [your-file] with the appropriate information)
Please create an Issue for any improvements, suggestions or errors in the content.
You can also contact me using Linkedin for any other queries or feedback.