contact us form with css
Contact Form with html5 and CSS3 Responsive
Very good at all, this time I bring something very simple but very useful, it is the design of a contact form in HTML and CSS for your web or blog.
The purpose of this small contribution is very simple but I'm sure going to serve more than one course if you already know how to do this well then nothing happens we are here for those who do not know it that these little tutorials is more nothing to help and motivate those with the desire to learn and want to increase their knowledge.
Views: 743
2018
<!DOCTYPE html>
lang="en" class="no-js"
charset="utf-8"
Flat Contact Form
name="viewport" content="width=device-width, initial-scale=1.0"
name="description" content=""
name="author" content=""
<!-- CSS -->
rel='stylesheet' href='http://fonts.googleapis.com/css?family=Patua+One'
rel='stylesheet' href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400'
href='http://fonts.googleapis.com/css?family=Roboto+Slab:100' rel='stylesheet' type='text/css'
class="page-container"
class='contact' action="" method="post"
Contact Us!
type="text" name="name" class="name" placeholder="Name"
type="text" name="email" class="email" placeholder="Email"
type="text" name="subject" class="subject" placeholder="Subject"
name="message" class="message" placeholder="Message"
onClick='return false;' type="submit"Send Message
body {
background: #fbf3d5;
font-family: 'Roboto Slab', serif;
font-weight: 400;
text-align: left;
-webkit-font-smoothing: antialiased;
}
::-moz-selection { background: #f8cc37; color: #4b2813; text-shadow: 0 2px 0 #fce653; }
::selection { background: #f8cc37; color: #4b2813; text-shadow: 0 2px 0 #fce653; }
.page-container {
margin: 0 auto;
padding: 60px 0 20px 0;
}
.contact {
position: relative;
width: 400px;
margin: 0 auto;
background: #fff;
}
hr {
color: #eee;
background-color: #eee;
height: 1px;
border: none;
}
.contact h1 {
height: 50px;
margin-bottom: 30px;
background: #fff;
font-family: 'Roboto Slab', serif;
font-size: 30px;
color: #bbb;
text-transform: uppercase;
line-height: 80px;
text-align: center;
}
.contact input {
width: 302px;
