一、表单的设计

　　1、注册表单页面

<html>

    <head>

        <title>表单的练习</title>

        <script>

            function mousein(){

                var desc=document.getElementById("desc");

                if(desc.value=="请输入描述信息！！！"){

                    desc.value="";

                }

            }

            function mouseout(){

                var desc=document.getElementById("desc");

                if(desc.value==""){

                    desc.value="请输入描述信息！！！";

                }

            }

        </script>

    </head>

    <body>

        <form action="../img/1.jpg" method="GET">

            <table border="1px" align="center" cellpadding="10px" bgColor="pink" borderColor="blue"

             cellspacing="0px">

                <caption><font color="red" size="6px">注册表单</font></caption>

                <tr>

                    <td>用户名：</td>

                    <td><input type="text" name="username" /></td>

                </tr>

                <tr>

                    <td>密码：</td>

                    <td><input type="password" name="password" /></td>

                </tr>

                <tr>

                    <td>确认密码：</td>

                    <td><input type="password" name="password2" /></td>

                </tr>

                <tr>

                    <td>性别：</td>

                    <td>

                        <input type="radio" name="sex"  value="man"/>男

                        <input type="radio" name="sex" value="women"/>女

                    </td>

                </tr>

                <tr>

                    <td>昵称：</td>

                    <td><input type="password" name="nickname" /></td>

                </tr>

                <tr>

                    <td>邮箱：</td>

                    <td><input type="password" name="email" /></td>

                </tr>

                <tr>

                    <td>爱好：</td>

                    <td>

                        <input type="checkbox" name="hobby"  value="dianying"/>看电影

                        <input type="checkbox" name="hobby"  value="football"/>踢足球

                        <input type="checkbox" name="hobby"  value="basketball"/>打篮球

                        <input type="checkbox" name="hobby"  value="eat"/>美食

                    </td>

                </tr>

                <tr>

                    <td>城市：</td>

                    <td>

                        <select name="city" >

                            <option value="bj">北京</option>

                            <option value="sh">上海</option>

                            <option value="gz">广州</option>

                            <option value="sz">深圳</option>

                            <option value="nj">南京</option>

                            <option value="wh">武汉</option>

                            <option value="hz杭州">杭州</option>

                        </select>

                    </td>

                </tr>

                <tr>

                    <td>头像：</td>

                    <td><input type="file" name="picfile" /></td>

                </tr>

                <tr>

                    <td>描述信息：</td>

                    <td>

                        <textarea id="desc" rows="5" cols="50" name="description"

                         onfocus="mousein()" onblur="mouseout()">请输入描述信息！！！</textarea>

                    </td>

                </tr>

                <tr>

                    <td>验证码：</td>

                    <td>

                        <input type="text" name="yanzhengma" />

                        <img width="100px" height="21.33px" src="../img/1.jpg" />

                    </td>

                </tr>

                <tr>

                    <td colspan="2" align="center">

                        <input type="submit" value="提交" />

                        <input type="reset" value="重置" />

                    </td>

                </tr>

            </table>

        </form>

    </body>

</html>

注册表单页面

html-表单的设计的更多相关文章

  1. Office365 InfoPath 表单的设计和应用（原创）

    表单的应用:我想到的有2种. 1 做为自定义表单库的模版. 通过发放url(模版链接)给用户来填写表单. 最后将在表单库中得到所有填写的信息列表. 如 2 上传表单做为ContentType 也就是自 ...

  2. [Axure RP] – 鼠标滑入按钮时自动下拉表单的设计示例

    转:http://blog.qdac.cc/?p=2197 Axure RP 是个好东东呀,大大方便了程序员与客户之间的前期调研时的交流.不过有一些控制并没有鼠标移入和移出的操作,比如 HTML 按钮 ...

  3. HTML+CSS基础知识（6）背景的设置、表格的设计、表单的设计和框架集

    文章目录 1.背景 1.1 代码 1.2 测试结果 2.背景练习 2.1 代码 2.2 测试结果 3.表格 3.1 代码 3.2 测试结果 4.练习 4.1 代码 4.2 测试结果 5.表单 5.1 ...

  4. Ext开场表单布局设计

    var form = new Ext.form.FormPanel({ labelAlign: 'right', labelWidth: 60, buttonAlign: 'center', titl ...

  5. ASP.NET MVC5+EF6+EasyUI 后台管理系统（44）-工作流设计-设计表单

    系列目录 设计表单是比较复杂的一步,完成一个表单的设计其实很漫长,主要分为四步. 开始之前先说说表的结构. 其实表Flow_Form与Flow_FormContent设计是有一个缺陷的.我总共是设置最 ...

  6. 基于Extjs的web表单设计器 第七节——取数公式设计之取数公式的使用

    基于Extjs的web表单设计器 基于Extjs的web表单设计器 第一节 基于Extjs的web表单设计器 第二节——表单控件设计 基于Extjs的web表单设计器 第三节——控件拖放 基于Extj ...

  7. 基于Extjs的web表单设计器 第六节——界面框架设计

    基于Extjs的web表单设计器 基于Extjs的web表单设计器 第一节 基于Extjs的web表单设计器 第二节——表单控件设计 基于Extjs的web表单设计器 第三节——控件拖放 基于Extj ...

  8. 基于Extjs的web表单设计器 第五节——数据库设计

    这里列出表单设计器系列的内容,6.7.8节的内容应该在春节后才有时间出了.因为这周末就请假回老家了,准备我的结婚大事.在此提前祝大家春节快乐! 基于Extjs的web表单设计器 基于Extjs的web ...

  9. .NET开源工作流RoadFlow-表单设计-新建表单（属性设置）

    点击表单设计工具栏上的 新建表单 按钮会弹出新表单属性设置框: 表单名称:新表单表名称. 数据连接:表单对应的数据库连接(此连接在 系统管理-->数据库连接 中维护). 数据表:表单对应的数据库 ...

  10. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（44）-工作流设计-设计表单

    原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(44)-工作流设计-设计表单 系列目录 设计表单是比较复杂的一步,完成一个表单的设计其实很漫长,主要分为四 ...

随机推荐

  1. bzoj2190 仪仗队

    题目传送门 思路: 哪些点能被人看到,其实就是哪些点不会被其他点挡住,只要顶点的坐标互质就可以了,互质用欧拉函数算.特殊考虑一下n=1和0的情况. 欧拉函数,Φ(x)=x(1-1/p1)(1-1/p2 ...

  2. 本地安全策略命令行secedit设置本地账户安全策略

    我们日常运行的控制台程序secpol.msc里面的内容,实质可以通过命令行完成,下面演示通过secedit命令来设置本地账号密码策略,启用密码复杂性和强制长度至少8位操作办法. ==> 新建文本 ...

  3. java 并发完成任务之CountDownLatch

    1.CountDownLatch是一个同步辅助类,犹如倒计时计数器,创建对象时通过构造方法设置初始值,调用CountDownLatch对象的await()方法则处于等待状态,调用countDown() ...

  4. CSS2.1

    学而时习之,不亦说乎!                              --<论语> CSS:cascading style sheet(层叠样式表) 作用:描述页面的样式. 书 ...

  5. 墨菲定律&吉德林法则&吉尔伯特定律&沃尔森法则&福克兰定律

    一.墨菲定律:越害怕什么,就越会发生什么 二.吉德林法则:把问题清楚地写下来,就已经解决一半了 三.吉尔伯特定律:工作中的最大问题就是没人跟你说该如何去做 四.沃尔森法则:把信息和情报排在第一位,金钱 ...

  6. DP Intro - Tree DP Examples

    因为上次比赛sb地把一道树形dp当费用流做了,受了点刺激,用一天时间稍微搞一下树形DP,今后再好好搞一下) 基于背包原理的树形DP poj 1947 Rebuilding Roads 题意:给你一棵树 ...

  7. 深入浅出理解linux inode结构

    一.inode是什么? 参考文档:http://tech.diannaodian.com/dw/lin/2012/0112/154629.html 做Android底层驱动或者嵌入式Linux的程序猿 ...

  8. unity项目架构

    Unity 游戏框架搭建 (一) 概述Unity 游戏框架搭建 (二) 单例的模板Unity 游戏框架搭建 (三) MonoBehaviour单例的模板Unity 游戏框架搭建 (四) 简易有限状态机 ...

  9. 九度oj题目1511：从尾到头打印链表

    题目1511:从尾到头打印链表 时间限制:1 秒 内存限制:128 兆 特殊判题:否 提交:6010 解决:1805 题目描述: 输入一个链表,从尾到头打印链表每个节点的值. 输入: 每个输入文件仅包 ...

  10. ebiao 报表工具使用入门

    一.ebiao简价 e表是一个功能强大的Web报表工具,可使复杂报表的设计简单化,避免了大量的复杂SQL编写以及编程来准备数据,报表设计的效率大大提高.e表分为e表 for .NET和e表 for J ...