• html笔记03:表单


    1.表单是用来收集用户填写的信息,可以说表单就是一个容器,里面的元素的类型可以不一样,所表示的功能也不同。

    表单基本语法:

     1 <html>
     2 <head>
     3   <title>表单的基本语法</title>
     4 </head>
     5 
     6 <body>
     7 
     8   <form>
     9   </form>
    10 </body>
    11 </html>

    2.表单的两属性

    action:表示表单提交后发送的URL地址,发送方式用method表示:可选参数有get/post,get传输量比较少,post传输量比较大

     1 <html>
     2 <head>
     3   <title>表单的基本语法</title>
     4 </head>
     5 
     6 <body>
     7 
     8   <form action= "show.aspx" method = "get">
     9      <input type="text"  >
    10 <br>
    11      <input type="password">
    12 <br>
    13      <input type="button" value="提交">
    14   </form>
    15 </body>
    16 </html>

    补充:<input>的语法中,完整语法为:

    <input type="#">

    这里#代码表示类型,可选项是:text,image,password,checkbox(复选框),radio(单选框),hidden(隐藏--密码),submit(提交),reset(重置)

    3.

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <title>登录界面</title>
     5 
     6 </head>
     7 
     8 <body>
     9    <h1>登录界面</h1>
    10    <form action="" method="get">
    11    用户名:<input type="text" name="username"/><br>
    12    密&nbsp;&nbsp;码:<input type="password" name="pwd"/><br>
    13    <input type="submit" value="登录"/><input type="reset"/>
    14 </form>
    15 </body>
    16 </html>

    4.

     1 名字:<input type = "text"  value = "请输入名字" name = "username"/> <br/>
     2 密码:<input type = "password"  name = "pwd"/> <br/>
     3 ***喜欢的水果***<br/>
     4 <!-- name = "v1"这里name我们都是取v1,这是为了:将来链接服务器时候,提交的时
     5 
     6 候比较方便-->
     7 <input type = "checkbox"  name = "v1"/> 西瓜 <br/>
     8 <input type = "checkbox"  name = "v1"/> 苹果 <br/>
     9 <!-- name = "sex" 这里单选的表单之中,我们取名必须一样,不然会出现问题-->
    10 ***选择性别***<br/>
    11 <input type = "radio"  name = "sex"/> 男 <br/>
    12 <input type = "radio"  name = "sex"/> 女 <br/>
    13 ****隐藏(它的用途主要是:既可提交数据,同时不影响界面)<br/>
    14 <input type = "hidden"  value = "123"  name = "salary"/>
    15 
    16 ****下拉选择框*****<br/>
    17 请选择你的出生地:
    18 <!-- 将来提交给网络远端数据库的时候,实际上提交的是像这里的name = "biradd"类
    19 
    20 似的标号-->
    21 <!-- 像刚刚开始option选项中没有属性value= **,这样的select控件携带的数据是不能
    22 
    23 提交给远端服务器的,必须添加value-->
    24 <select name = "biradd" >
    25   <!--实际开发的时候我们还是经验上加:调节下拉框宽度-->
    26   <option value = "">---请选择---</option>
    27   
    28   <option value = "beijing">北京</option>
    29   <option value = "shanghai">上海</option>
    30   <option value = "chongqing">重庆</option>
    31 <select/><br/>
    32 
    33 ****请留言*****<br/>
    34 <textarea  cols = '30'  rows = '10' >请这里输入…… </textarea><br/>
    35 
    36 ****请选择你要上传的文件*****<br/>
    37 <input type = "file" name = "myfile"/>请选择文件

    输出结果如下:

  • 相关阅读:
    记录s标签范例
    链表问题总结
    Hibernate学习总结
    HDU2460-Network
    CF464C-Substitutes in Number
    CF666E-Forensic Examination
    CF373C-Counting Kangaroos is Fun
    CF558E-A Simple Task
    HDU5669-Road
    CF341D-Iahub and Xors
  • 原文地址:https://www.cnblogs.com/hebao0514/p/4609428.html
Copyright © 2020-2023  润新知