form
Style 1
Style 2
<h3 class="sc-sub-title">Style 1</h3>
<form action="../mail.php">
<div class="input-box transparent"><input type="text" placeholder="Name*" name="name"></div>
<div class="input-box transparent"><input type="text" placeholder="Email*" name="email"></div>
<div class="input-box transparent"><input type="text" placeholder="Subject" name="subject"></div>
<div class="input-box transparent"><textarea name="message" placeholder="Message"></textarea></div>
<div class="input-box submit-box width-full"><input type="submit" class="button large" value="send"></div>
</form>
<h3 class="sc-sub-title">Style 2</h3>
<form action="../mail.php">
<div class="input-box">
<label for="name">Name*</label>
<input type="text" name="name" id="name">
</div>
<div class="input-box">
<label for="email">Email*</label>
<input type="text" name="email" id="email">
</div>
<div class="input-box">
<label for="subject">Subject</label>
<input type="text" name="subject" id="subject">
</div>
<div class="input-box">
<label for="message">Message</label>
<textarea name="message" id="message"></textarea>
</div>
<div class="input-box submit-box width-full">
<input type="submit" class="button large" value="send">
</div>
</form>
/* Form Input */
.input-box {
float: left;
margin-bottom: 18px;
width: 100%;
}
.input-box:last-child {
margin-bottom: 0;
}
.input-box-2 {
margin-left: -15px;
margin-right: -15px;
}
.input-box-2 .input-box {
display: block;
float: left;
margin-left: 0;
margin-right: 0;
padding-left: 15px;
padding-right: 15px;
width: 50%;
}
.input-box-2 .input-box:last-child {
margin-bottom: 18px;
}
.input-box label {
color: #303030;
display: block;
font-weight: 500;
line-height: 12px;
margin-bottom: 10px;
text-align: left;
}
.input-box input, .input-box textarea, .input-box select {
background: #fff none repeat scroll 0 0;
border: 1px solid #eee;
color: #909090;
font-size: 12px;
font-weight: 300;
height: 44px;
padding: 5px 12px;
text-align: left;
width: 100%;
}
.input-box select {
appearance: none;
-moz-appearance: none;
background: #fff url("img/icon/select-arrow.png") no-repeat scroll right center;
font-size: 14px;
}
.input-box.transparent input, .input-box.transparent textarea , .input-box.transparent select {
background-color: transparent;
}
.input-box textarea {
min-height: 106px;
}
.input-box input:focus, .input-box textarea:focus {
color: #303030;
}
.submit-box {
width: auto;
}
.submit-box input {
border: medium none;
color: #fff;
font-size: 14px;
font-weight: 500;
line-height: 37px;
padding: 0 36px;
text-align: center;
text-transform: uppercase;
width: auto;
}
.submit-box.width-full {
width: 100%;
}
.submit-box.width-full input {
width: 100%;
}
.submit-box input:hover {
background: #303030 none repeat scroll 0 0;
color: #fff;
}











ADDRESS: 28 Green Tower, Street Name New York City, USA
Telephone: +88017 222 333
Email: contact@shopieee.com
account
newsletter
Subscribe by our newsletter and get update protidin.
2016 ® All Rights Reserved - 网页模板 Responsive Theme
