使用HTML/CSS写注册界面
2017-10-03 23:54
447 查看
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注册</title> <style type="text/css"> th{ font-size: 30px; color:blue; } .td_1{ font-size: 25px; text-align: center; width:80px; height: 30px; } .td_2{ font-size: 20px; } .td_3{ text-align: center; width: 200px; font-size: 20px; } .a_1{ text-decoration: none; color:green; } .img_1{ width: 27px; border-radius: 50%; overflow: hidden; } </style> </head> <body> <div style="position: absolute;z-index: -1;width: 99%;height: 98.5%"> <img src="background_1.jpg" alt="background_1" width="100%" height="100%"> </div> <form action="index.html"> <table border="1" cellpadding="10" cellspacing="1" width="520px" align="center" bgcolor="#adeaea"> <th align="center" colspan="2">新用户注册</th> <td rowspan="4" class="td_3">已有账号 <a href="login.html" target="_target" class="a_1">立即登录</a></td> <tr> <td class="td_1">用户名</td> <td><input type="text" name="" value="" class="input_1" maxlength="12"></td> </tr> <tr> <td class="td_1">密 码</td> <td><input type="password" name="" value="" class="input_1" maxlength="15"></td> </tr> <tr> <td class="td_1">性 别</td> <td class="td_2"> <input type="radio" name="sex" value="" checked="checked">男 <input type="radio" name="sex" value="">女 </td> </tr> <tr> <td class="td_1">爱 好</td> <td style="font-size: 13px;"> <input type="checkbox" name="" value="">唱歌 <input type="checkbox" name="" value="">跳舞 <input type="checkbox" name="" value="">绘画 <input type="checkbox" name="" value="">骑车 <input type="checkbox" name="" value="">书法 <input type="checkbox" name="" value="">运动 <input type="checkbox" name="" value="">跑步 <input type="checkbox" name="" value="">学习 </td> <td rowspan="4" class="td_3"> -----快速登录-----<br><br> <a href=""><img src="QQ_Logo.jpg" alt="QQ_Logo" class="img_1"></a> <a href=""><img src="微博_Logo.jpg" alt="微博_Logo" class="img_1"></a> <a href=""><img src="微信_Logo.jpg" alt="微信_Logo" class="img_1"></a> <a href=""><img src="支付宝_Logo.jpg" alt="支付宝_Logo" class="img_1"></a> </td> </tr> <tr> <td class="td_1">家 乡</td> <td> <select name="" id=""> <optgroup label="四川"> <option value="广安">广安</option> <option value="成都">成都</option> <option value="自贡">自贡</option> <option value="德阳">德阳</option> <option value="绵阳">绵阳</option> <option value="眉山">眉山</option> </optgroup> <optgroup label="广东"> <option value="深圳">深圳</option> <option value="广州">广州</option> <option value="惠州">惠州</option> <option value="珠海">珠海</option> <option value="东莞">东莞</option> <option value="汕头">汕头</option> <option value="韶关">韶关</option> </optgroup> <optgroup label="湖南"> <option value="张家界">张家界</option> <option value="长沙">长沙</option> <option value="湘西">湘西</option> <option value="岳阳">岳阳</option> <option value="衡阳">衡阳</option> <option value="韶山">韶山</option> <option value="株洲">株洲</option> </optgroup> </select> </td> </tr> <tr> <td class="td_1">自<br>我<br>介<br>绍</td> <td> <textarea name="" id="" cols="25" rows="10"> </textarea> </td> </tr> <tr> <td colspan="2" align="center"> <input type="submit" name="" value="确认" style="font-size: 20px;color:blue;background-color: #adeaea;width: 70px;"> <form action="index.html"> <input type="submit" name="" value="取消" style="font-size: 20px;color:blue;background-color: #adeaea;width: 70px;"> </form> </td> </tr> </table> </form> </body> </html>
结果展示
相关文章推荐
- 开源组件NanUI - 使用HTML/CSS/JS来构建.Net Winform应用程序界面
- 【html+css】fetch界面 smarty中 使用 if语句
- 利用html、css、javascript、php同时交互数据库制作的注册登录界面
- 开源组件NanUI一周年 - 使用HTML/CSS/JS来构建.Net Winform应用程序界面
- 使用HTML和CSS制作下图界面(溢出)
- C# 封装miniblink 使用HTML/CSS/JS来构建.Net 应用程序界面和简易浏览器
- 开源组件NanUI一周年 - 使用HTML/CSS/JS来构建.Net Winform应用程序界面
- 使用HTML+CSS+JS制作简单的网页菜单界面
- Atitit 使用h5技术( html css js)制作桌面程序gui界面解决方案attilax总结
- javaEE02 使用HTML的表单标签编写“注册页面”,使用DIV和CSS重写网站首页
- 【html+css】简单注册界面(含可运行源码)
- 使用HTML和CSS写登录界面
- html&css实现阿里巴巴注册界面
- HTML文档中使用CSS
- 写注册页面时使用的expression(css的行为)
- 一个jsp+cgi+html小工程,完成注册,后台使用CGI
- 使用HTML+CSS编写一个灵活的Tab页
- 使用HTML,CSS快速导出数据到Excel(转)
- IE与Firefox中兼容的html设计中使用CSS改变鼠标为手形
- 在HTML中使用CSS美化网页的三种方法