仿百度商桥留言效果代码

仿百度商桥留言效果代码

<div class="about1">
	<div class="about_title1">在线留言</div>
	<div class="about_B">
		<form id="feedback_form" name="feedback_form">
		<textarea class="about_inp1" placeholder="请在此输入留言内容，我们会尽快与您联系（必填）" id="content" name="content" ></textarea>
		<input class="about_inp2" type="text" placeholder="姓名" id="name" name="name" />
		<input class="about_inp2" type="text" placeholder="电话" id="phone" name="phone" />
		<input class="about_inp2" type="text" placeholder="邮箱" id="email" name="email" />
		<input class="about_inp2" type="text" placeholder="地址" id="address" name="address" />
		<input class="about_btn" type="button" value="发送" id="btnSubmit" name="btnSubmit" />
		</form>
	</div>
</div>				
<style>
.about1{background:#ededed;max-width:200px;}
.about_title1{display:block; height:40px; line-height:40px;  background:#ec510e; overflow:hidden; font-family:'Microsoft YaHei'; font-size:18px; color:#fff; font-weight:bold; text-indent:10px; border-radius:5px 5px 0 0;}
.about_B{display:block; padding:10px; overflow:hidden;}
.about_inp1{width:100%; float:left; height:86px; border:1px solid #dfdfdf; font-family:'Microsoft YaHei'; font-size:12px; color:#a8a8a8; line-height:20px; padding:8px;}
.about_inp2{width:100%; float:left; height:26px; border:1px solid #dfdfdf; font-family:'Microsoft YaHei'; font-size:12px; color:#a8a8a8; line-height:24px; padding:0 8px; margin-top:5px;}
.about_btn{width:82px; float:left; height:26px; background:#0076e5; font-family:'Microsoft YaHei'; font-size:12px; color:#fff; line-height:24px; margin-top:5px;border:0px;}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color: #a8a8a8;} 
input:-moz-placeholder, textarea:-moz-placeholder {color: #a8a8a8;} 
</style>