表单应用举例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">

            div{
                width: 600px;
                height: 700px;
                background-color:#f7b497 ;
                border-style: solid;
                margin-top: 30px;
            }
            .div1{
                border-style: solid;
            }
            /*body{
                background-image: url(C:\Users\lan\Desktop\html\HTML_demo\2.jpg);
            }*/
        </style>
    </head>
    <body>
        <center>
            <div class="div1">
                <h1><center>welcome to my private web</center></h1>
        <form method="post" action="http://www.sogou.com/web">
            <center>
            <p>邮箱 &nbsp; <input type="text" name="query"></p>
            <p>用户名&nbsp;<input type="text" name="email"><br/></p>
            <p>密码 &nbsp; <input type="password" name="pwd"></p>
            <p>确认密码<input type="password" name="pwd"></p>
            验证码。。。
            <p>选择语言种类(问题1多选)</p>
            <p>
                python<input type="checkbox" nname="hobby" value="1">
                java<input type="checkbox" nname="hobby" value="2">
                c<input type="checkbox" nname="hobby" value="3">
                c#<input type="checkbox" nname="hobby" value="4">
                c++<input type="checkbox" nname="hobby" value="5">
            </p>
            <p>单选
                男<input type="radio" name="sex" value="1" />
                女<input type="radio" name="sex" value="2" />
            </p>
            <p>下拉菜单
                <select name="menu">
                    <option value="1">董事长</option>
                    <option value="2">助理</option>
                    <option value="3">CEO</option>
                    <option value="4">CTO</option>
                    <option value="5">总监</option>
                    <option value="6">经理</option>
                    <option value="7" selected="selected">职员</option>
                </select>

            </p>
            <p>备注
                <textarea name="qq" rows="10" cols="55">

                </textarea>
            </p>
            <input type="submit" value="提交">
            </center>
        </form>
            </div>
        </center>
    </body>
</html>

引用自我当道士那儿些年的博客

时间： 2024-10-23 13:22:21

表单应用举例的相关文章

HTML5表单新特征简介与举例

一.前言一撇其实关于HTML5的表单特征早在去年你必须知道的28个HTML5特征.窍门和技术一文中就有所介绍(在第十一项),不过,有些遗憾的是,此部分的介绍是以视频形式展示的,其实,是视频还好啦,关键是TouTuBe视频,需要越狱观看.得,像我这样安分守已的良民,除了看空姐,其他情况都是懒得fan墙的,所以这部分视频展示的内容,其实就是个空. 所以,这里打个补丁,把这部分内容完善下.本文的大致内容有: # input type=number / # input type=range / # i

form表单那点事儿(上) 基础篇

做为html中最为常见,应用最广泛的标签之一,form常伴随前端左右.了解更深,用的更顺. 目录: 表单属性表单元素常识模拟外观表单属性这个表单展示了form表单常用的属性属性名属性值描述 action 一个url地址指定表单提交到的地址 method `GET` , `POST` 表单将以此种方法提交到服务器 target `_self` 当前页面 `_blank` 每次在新窗口打开 `blank` 每次在同一个新窗口打开 `_parent` 父级frame `_top` 顶

07 html 表单form元素各种input元素常用元素综合案例

Html的表单元素,主要用途:用户输入数据,并提交给服务器基本语法是: <form action=”url”(是指把表单提交给谁) method=”提交的方法(get/post),默认是get”> 各种输入元素[输入框,下拉列表,文本域,密码框] </form> 案例:登陆界面 login.html <html> <head> <title>登陆界面</title> </head> <body> <fo

form的智能表单

1.智能表单的介绍其中,(1)中的使用格式使得form不会太臃肿. 2.使用规范 3.新属性 4.举例二.程序 1.关于邮件的问题 1 <!DOCTYPE html> 2 <head> 3 <meta charset=utf-8> 4 <title>form test</title> 5 </head> 6 <body> 7 <form id="for" action=""

HTML与用户的交互表单

使用表单标签,与用户交互网站怎样与用户进行交互?答案是使用HTML表单(form).表单是可以把浏览者输入的数据传送到服务器端,这样服务器端程序就可以处理表单传过来的数据. 语法: <form method="传送方式" action="服务器文件"> 讲解: 1.<form> :<form>标签是成对出现的,以<form>开始,以</form>结束. 2.action :浏览者输入的数据被传送到的地方,

利用jquery.validate以及bootstrap的tooltip开发气泡式的表单校验组件

表单校验是页面开发中非常常见的一类需求,相信每个前端开发人员都有这方面的经验.网上有很多成熟的表单校验框架,虽然按照它们默认的设计,用起来没有多大的问题,但是在实际工作中,表单校验有可能有比较复杂的个性化的需求,使得我们用这些插件的默认机制并不能完成这些功能,所以要根据自己的需要去改造它们(毕竟自己还不到那个写一个完美的校验框架的层次).我用过formValidation这个校验框架,虽然它跟bootstrap配合地很好,但是校验风格太死板,不太满足个性化的场景:后来我找到了jquery.val

好用的表单验证插件

在做项目过程中,使用了jquery的一个验证表单的插件--jquery validation.这里简单整理了一下这个强大的表单验证插件的一些常用的方法,以及在使用过程中需要注意的地方. 首先要想使用,首先需要引入jquery,然后引入jquery validation两个文件.然后通过插件的初始化方法,进行初始化,之后就可以按照自己的需要进行使用了. //引入jquery,版本1.6+ <script type="text/javascript" src="http:/

h5通过表单将localStorage里的信息传到java后台servlet处理

做技术和人生一样,哪有什么做不到,只有想不到. 乍一看你以为我在开玩笑呢.百度过,没有这种操作. 没有就不能实现了吗 /坏笑 -------------------------------------------------------------------------------华丽丽分割线------------------------------------------------------------------------------------------------------

React之表单

第一部分:表单基础在React中,修改表单的唯一途径是使用setState方法.举例如下: class NameForm extends React.Component { constructor(props) { super(props); this.state = {value: ''}; this.handleChange = this.handleChange.bind(this); this.handleSubmit = this.handleSubmit.bind(this); }