Venomous Venomous - 3 years ago 88
CSS Question

Can I use just HTML and CSS to make a contact form?

So I was creating a contact form and realized that I am not sure how to connect the submit button to send it to a set email. Is HTML and CSS enough to do this or do I need a database, storage, or different language? If so which one would be the easiest to learn and do? Here is my code if you need it.



body {
background: #292a2b;
font-family: Arial;
}

.contact-title {
margin: auto;
width: 30%;
border: 1.5px solid #0054a9;
padding: 5px 0px;
border-radius: 8px 8px 0px 0px;
background: #0054a9;
}

.contact-title h2 {
text-align: center;
color: #ede;
letter-spacing: 2px;
}

.name-contact {
margin: auto;
width: 30%;
padding: 15px 0px 10px 0px;
background: #fff;
}

.message-contact {
margin: auto;
width: 30%;
padding: 15px 0px 10px 0px;
background: #fff;
}

.box-size {
margin-left: 5%;
width: 90%;
height: 40px;
font-size: 18px;
border: 0px;
border: 1px solid #d0d0d0;
}

.submit-size {
margin-left: 5%;
width: 90%;
height: 50px;
font-size: 18px;
border: 0px;
}
textarea {
font-family: inherit;
font-size: inherit;
height: 2px;
}

.submit-contact {
margin: auto;
width: 30%;
padding: 15px 0px 55px 0px;
border-radius: 0px 0px 8px 8px;
background: #fff;
}

h3 {
text-align: center;
border-radius: 8px;
padding: 10px 10px;
color: #fff;
background: #0054a9;
margin-left: 38%;
margin-right: 38%;
letter-spacing: 1px;
font-size: 15px;
}

.sub-btn {
height: 40%;
width: 20%;
}

<section class="contact">
<div class="contact-title">
<h2> CONTACT </h2>
</div>
<div class="name-contact">
<label for="Name"></label>
<input class="box-size" type="text" id="fname" name="firstname" placeholder="Name" required>
</div>
<div class="name-contact">
<label for="Email"></label>
<input class="box-size" type="text" id="femail" name="email" placeholder="Email" required>
</div>
<div class="message-contact">
<label for="Message"></label>
<textarea class="box-size" type="text" id="fmessage" name="message" placeholder="Message" required></textarea>
</div>
<div class="submit-contact submit-size">
<h3 class="sub-btn">Submit</h3>
</div>
</section>




Answer Source

You will want to use PHP in addition to your HTML and CSS in order to process the form information. With a contact form you could simply e-mail the information collected in the form to your e-mail address or you could also send the person contacting you an e-mail (autoresponse) letting them know you received their information. With PHP you can also store the information in a database like MySQL. In any case you need something beside HTML and CSS to handle the information. I recommend you start by reading the following w3schools.com tutorial on forms.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download