html教程-用户反馈表单源代码 - 旺仔先森博客

html教程-用户反馈表单源代码

作者: 旺仔

全网最全的网络资源分享网站

手机扫码查看

特别声明:文章多为网络转载,资源使用一般不提供任何帮助,特殊资源除外,如有侵权请联系wangzaibk@qq.com!

分享

截图:

 

 

源代码:

<!DOCTYPE html><html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title>用户反馈表单</title> <style type="text/css">.feedback{ /*定义表单整体的宽带以及边框样式等*/ width:600px; padding:1px; border:1px solid #e8e8e8; background-color:#ffffff;}.feedback{/*定义表单内部的所有元素补白、外补白以及文字的相关样式*/ margin:0; padding:0; font:normal 12px/1.5en "宋体" ,verdana,lucida,Arial,Helvetica,sans-serif;}.feedback h3 {/*定义表单标题的高度、文字样式以及背景颜色等*/height:24px;line-height:24px;font-weight:bold;font-size:20px;tet-indent:12px;color:#ffffff;background-color:#999999;}.feedback .content{/*表单内容区域增加10px的左右补白,使其与表单外框产生间距*/ padding: 0 10px;}.feedback fieldset{ padding-top: 12px; margin-top: 10px; border: 0 none; border-top: 1px solid #999999;}.feedback legend{ padding: 0 5px; color: #333333;}.feedback .frm_cont{ margin-top: 8px;}.feedback label{ float: left; width: 80px; height: 22px; line-height: 24px; text-align: right; color: #ABABAB; cursor: pointer;}.feedback .base_info input{ width: 200px; height: 17px; padding: 3px 2px 0; border: 1px solid #DEDEDE;}.feedback .email input { width: 150px; /**/}.feedback .url input{ width: 240px;}.feedback .up_file input{ width: auto; height: auto;}.feedback .tips{ padding: 5px 0 0 80px; color: #ff3260;}.feedback textarea{ width: 240px; height: 66px; padding-left: 2px; border: 1px solid #DEDEDE;}.feedback .btns{ padding: 5px 0; text-align: center;}.feedback .btns button{ height: 22px; margin: 0 5px; letter-spacing: 3px; cursor: pointer;} </style> </head> <body> <div class="feedback"> <h3>反馈表单</h3> <div class="content"> <form method="post" action=""> <fieldset class="base_info"> <legend>用户信息</legend> <div class="frm_cont userName" ><label for="userName">用户名:</label> <input type="text" value="" id="userName" /> </div> <div class="frm_cont email" ><label for="email">电子邮箱:</label> <input type="text" value="@" id="email" /> </div> <div class="frm_cont url" ><label for="url">网站主页:</label> <input type="text" value="http://" id="url" /> </div> </fieldset><fieldset> <legend>反馈内容:</legend> <div class="frm_cont up_file"> <label for="up_file">相关图片:</label><input type="file" id="up_file"> <p class="tips">本系统只支持上次.jpg,.png, .gif</p> </div> <div class="frm_cont msg"> <label for="msg">内容:</label><textarea name="name" rows="4" cols="40" id="msg"></textarea> <p class="tips">请输入内容!</p> </div></fieldset><div class="btns"> <button type="submit">提交</button> <button type="reset">重置</button></div> </form> </div> </div> </body></html>
分享到:
打赏

本站开启投稿功能注册账号即可投稿


文章版权信息

阅读时间:  发布于:2020-2-12

本文标题:html教程-用户反馈表单源代码

本文链接:http://www.52ooooo.com/post-338.html

版权声明:文章为《 旺仔》原创,转载请保留出处!

标签:留言源代码留言反馈表源码反馈表源代码

相关推荐

评论

切换注册

登录

您也可以使用第三方帐号快捷登录

切换登录

注册

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

Sitemap    189.75ms2942
网站代码 html教程-用户反馈表单源代码
截图:  源代码:<!DOCTYPE html><html lang="en" dir="ltr"> &l...
扫描二维码阅读原文
旺仔先森博客 January, 01
初始化 ×