制作html表单

客户端(每个用户的计算机)在浏览网页时,都会向服务器(后台)端索要数据,然后将得

到的数据呈现在浏览器当中。除了索要数据之外,有时客户端也希望能够向服务器端发送

一些数据。

这时我们就需要表单,如百度的输入框,注册时的输入框和按钮都是表单。

表单

<form action=””></form>

表单元素(能单独用)

<input type=”text”><br>

<input type=”password”>放到表单里面

<button>提交</button>

通用格式:<input type=”类型” name=”” value=””>

属性: name  value给后台发送的值

文本类型 属性:readonly(只读,属性名跟属性值一样的可以不写属性值)maxlength(最大 写入长度值) size(栏位显示宽度)disabled (不可操作的)

Text(普通文本), password(密码框),hidden(隐藏域,页面上看不见,但 会传到后台)

textarea(特殊格式)<textarea name=””id=”” cols=“ ” rows=””></textarea> 将内容提交后台

选择类型 属性:checked(默认选中)如果想设置必须选择某项,加checked和disabled

Selected (option的默认选中)multiple 将下拉选项全部显示

   Size=“数字”显示多少个选项

Radio(单选)当name值分为一组生效 checkbox(多选)

Select(特殊格式,下拉) <select  name=””id=””> <option value=””>

按钮类型

button(普通按钮)reset(重置按钮)

Submit (提交按钮)=<button></button>(必须在表单内)

按钮图像:<button name=”栏位名称” type=”图象形态”>

<img src=”URL”>

</button>

图像按钮:<input type="image" src="url" alt="文本">

其他类型

File(文件) date(时间日期) color(颜色)。。。。。。。

表单属性

Action(往哪提交,指到指定文件)

Method(提交方式)默认为get: ***php?text=***&password=***** 不安全

Post 不显示,较安全

Enctype multipart/form-data(发送文件)

<fieldset>

修饰表单

</fieldset>

<Legend>表单标题,与<form>同级

 

表单的功能结构:

 

主标记结构:<from>…</from>

属性 值 说明

name 字符串 给这个表单起个名字

method get/post 表单的传输方式

action url 传输目标

enctype="multipart/form-data"

 文本栏、密码栏、隐藏栏

 

文本栏:<input type=”text” name=”栏位名称” value=”栏位内定值” size=”栏位显示宽度” maxlength=”栏位数据输入最大长度” readonly=”readonly”>

密码栏:<input type=”password” name=”栏位名称” value=”栏位内定值” size=”栏位显示宽度” maxlength=”栏位数据输入最大长度” readonly=”readonly”>

隐藏性栏位:<input type=”hidden” name=”栏位名称” value=”栏位值”>

 复选栏、单选栏

 

多重勾选栏位:<input type=”checkbox” name=”栏位名称” value=”内定值” checked=”checked” disabled=”disabled”>

单选栏位:<input type=”radio” name=”栏位名称”  value=”内定值”                        checked=”checked” disabled=”disabled”>

 窗体栏位、区块栏位

 

窗体选项栏位设置:<select name=”栏位名称” size=”数字” >
                   <option value=”选项值” selected=”selected”>…
                   <option value=”选项值”>…
                  <option value=”选项值”>…
                  </select>

//分组<optgroup label="分组名称"></optgroup>

//多选multiple

文字区块的设置:<textarea cols=”设置长度” rows=”设置宽度”>
                   ………
                   </textarea>

 

按钮、图像按钮

 

按钮设置: <input type=”submit” value=”按钮中显示的文字”>
         <input type=”reset” value=”按钮中显示的文字”>

按钮图像:<button name=”栏位名称” type=”图象形态”>
         <img src=”URL”>
         </button>

图像按钮:<input type="image" src="url" alt="文本">

允许上传文件

上传栏位:<input type="file" name="file">

 表单加上外框和标题

 

外 边 框:<fieldset>...</fieldset>

标  题:<legend>...</legend>

跟随我在oracle学习php(4)的更多相关文章

  1. 跟随我在oracle学习php(19)

    Order by子句 形式: order  by  排序字段1  [排序方式],  排序字段2  [排序方式], ..... 说明: 对前面取得的数据(含from子句,where子句,group子句, ...

  2. 跟随我在oracle学习php(18)

    修改表: 一般概述 通常,创建一个表,能搞定(做到)的事情,修改表也能做到.大体来说,就可以做到: 增删改字段: 增:alter  table  表名  add  [column]  字段名  字段类 ...

  3. 跟随我在oracle学习php(17)

    通用设定形式 定义一个字段的时候的类型的写法. 比如: create  table  tab1  (f1  数据类型 ); 数据类型: 类型名[(长度n)]  [unsigned]  [zerofil ...

  4. 跟随我在oracle学习php(16)

    数据库的增删改查 增:create  database  [if  not  exists ] 数据库名  [charset  字符集]  [collate  字符排序规则]: 说明: 1,if  n ...

  5. 跟随我在oracle学习php(15)

    开发环境 独立开发环境:组成 Windows/Linux php Apache MySQL 集成开发环境:phpstudy wamp xammp 关系数据库: SQL: Struct Query La ...

  6. 跟随我在oracle学习php(14)

    CSS3的@keyframes用法详解: 此属性与animation属性是密切相关的,关于animation属性可以参阅CSS3的animation属性用法详解一章节. 一.基本知识: keyfram ...

  7. 跟随我在oracle学习php(13)

    常用的css样式 [class~="col-6"]:选择我所有类名中包含有col-6独立单词的元素 [class*="col-"]:选择所有类名中含有" ...

  8. 跟随我在oracle学习php(12)

    DOM 文档对象模型 body:(什么时候)找到标签 操作标签找到标签:(都会返回一个js对象)document.getElementById() 通过iddocument.getElementsBy ...

  9. 跟随我在oracle学习php(11)

    数组专题 数组遍历: 1,普通for循环,经常用的数组遍历 var arr = [1,2,0,3,9]; for ( var i = 0; i <arr.length; i++){ consol ...

  10. 跟随我在oracle学习php(10)

    正则表达式 做验证 做匹配 用符号来描述书写规则:/ 中间写正则表达式 /^ :匹配开头,$:匹配结尾 : /^ve/以ve开头的 /ve$/以ve结尾\d:一个任意的数字\w:一个任意的数字或字母\ ...

随机推荐

  1. python 对反斜杠的处理问题

    首先,"/"左倾斜是正斜杠,"\"右倾斜是反斜杠,可以记为:除号是正斜杠一般来说对于目录分隔符,Unix和Web用正斜杠/,Windows用反斜杠,但是现在Wi ...

  2. python中使用os.path.join()

    os.path.join的详细解释请移步os.path模块在使用的过程中,我使用如下代码: import ospath = "F:/gts/gtsdate/"b = os.path ...

  3. [Android] 转-RxJava+MVP+Retrofit+Dagger2+Okhttp大杂烩

    原文url: http://blog.iliyun.net/2016/11/20/%E6%A1%86%E6%9E%B6%E5%B0%81%E8%A3%85/ 这几年来android的网络请求技术层出不 ...

  4. STM32的型号的命名规则

    每种STM32的产品都由16个字母或数字构成的编号标示,用户向ST订货时必须使用这个编号指定需要的产品.这16个字符分为8个部分,下面通过一个例子说明它们的意义: STM32 F C T xxx ST ...

  5. mybatis源码解析12---ResultSetHandler解析

    说完了StatementHandler和ParameterHandler,接下来就需要对查询的结果进行处理了,而对于sql结果的处理是由ResultSetHandler处理的,ResultHandle ...

  6. 使用go语言数据库

    1.下载并导入数据库驱动包(注意配置环境变量.数据库.go.以及ENV) 这里选择了Go-MySQL-Driver这个实现.地址是:https://github.com/go-sql-driver/m ...

  7. videojs+hls+rtmp流媒体播放

    前言:刚接触前端,小白一个,如有出错,请指正,谢谢! 注:视频格式可以分为适合本地播放的本地影像视频和适合在网络中播放的网络流媒体影像视频两大类. 一.互联网网络流媒体简介 HTTP stream是各 ...

  8. java学习路线之必会的java基础教程

    大数据产业已进入发展的“快车道”,急需大量优秀的大数据人才作为后盾.如果你是Java编程出身,那学习大数据自然是锦上添花:但如果你是刚刚接触大数据技术,还在Java编程基础阶段,这篇文章非常值得你看! ...

  9. Docker Swarm 负载均衡详解 or 模式选择

    Docker Swarm 负载均衡详解 Swarm模式内置DNS组件,可以自动为集群中的每个服务分配DNS记录. Swarm manager使用内部负载均衡,根据服务的DNS名称在集群内的服务之间分发 ...

  10. GDB in Action

    GDB in Action 入门 编译 gcc -g -O0 -o word2vec.c word2vec -g 选项:要求 gcc 编译器保留调试符号信息. -O0 选项表示不优化,从 O1 ~ O ...