.表单form

单是一个包含表单元素的区域。

表单能够包含 input 元素,textarea、select、fieldset、legend 和 label 元素。

表单使用标签(<form>)定义。

表单用于向服务器传输数据。

<form name="form1" action="URL" method="get">

用户名:<input type="text" name="uname" />

密 码:<input type="password" name="passwd" />

</form>

属性 说明

name 表单的名称

action 表单提交地址

method 表单数据提交的方式 (get ,post)

enctype MIME类型

target 打开方式

<input>(表单元素:输入框)

属性 说明

type input元素类型

name input 元素的名称

value input 元素的值

size input 元素的宽度

readonly 是否只读

maxlength 输入字符的最大长度

disabled 是否禁用

文本框:<input type="text" name="username" value="" />

密码框:<input type="password"name="passwd"/>

单选框:<input type="radio"name=" "value=" "checked />

复选框:<input type="checkbox"name="" value=" "/>

隐藏域;<input type="hidden" name="" value=""/>

按钮:

<input type="button" name="btn" value="确定"/>

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

<input type="reset" name="reset" value="重写"/>

<input type="image"name="img_btn" src="btn.gif"/>

上传文件:<input type=”file” name=””/>

注意

利用这项功能时,在 form 标签中要指定method属性。要把method 指定为post, enctype属性指定为 multipart/form-data。

说明:

multiple     控制是否上传多文件

textarea(表单元素:多行文本域)

<textarea name="content" rows="5" cols="50"> </textarea>

属性 说明

name 元素的名称

rows 指定文本框的高度

cols 指定文本框的宽度

select(表单元素:下拉框)

<select name="city">

<option value="0">请选择</option

<option value=“bj” selected >北京</option>

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

</select>

属性 说明

name 下拉列表框的名称

size 下拉列表框的显示行数

multiple 是否多选

disabled 是否禁用

selected 设置默认选中的选项

value 选项的值

optgroup(表单元素:下拉框分组)

optgroup 元素用于组合选项

<select name="city" multiple>

<optgroup label="广东">

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

</optgroup>

</select>

属性 说明

label 指定组合选项名称

Label : lable 标签的作用是将输入项或选项及其标签文字关联起来。

例:

<input type="radio" name="sex" value="1" id="male" />

<label for="male">男</label>

HTML5的表单所有Input类型 type

HTML基础之三(form表单)的更多相关文章

  1. [php基础]PHP Form表单验证:PHP form validator使用说明

    在PHP网站开发建设中,用户注册.留言是必不可少的功能,用户提交的信息数据都是通过Form表单提交,为了保证数据的完整性.安全性,PHP Form表单验证是过滤数据的首要环节,PHP对表单提交数据的验 ...

  2. 前端基础:form表单提交

    今天介绍下form表单提交经常用到的表单元素. 1:datalist元素,一般与input组建配合使用,以定义可能输入的值,例如: <!DOCTYPE html> <html lan ...

  3. Django基础之Form表单验证

    Form表单验证 1.创建Form类(本质就是正则表达式的集合) from django.forms import Form from django.forms import fields from ...

  4. 前端HTML基础之form表单

    目录 一:form表单 1.form表单功能 2.表单元素 二:form表单搭建(注册页面) 1.编写input会出现黄色阴影问题 三:完整版,前端代码(注册页面) 四:type属性介绍 1.inpu ...

  5. Django基础之form表单

    1. form介绍 我们之前在HTML页面中利用form表单向后端提交数据时,都会写一些获取用户输入的标签并且用form标签把它们包起来. 与此同时, 我们在好多场景下都需要对用户的输入做校验, 比如 ...

  6. Django基础之form表单的补充进阶

    1. 应用Bootstrap样式 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

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

    form表单那点事儿(上) 基础篇 做为html中最为常见,应用最广泛的标签之一,form常伴随前端左右.了解更深,用的更顺. 目录: 表单属性 表单元素 常识 模拟外观 表单属性 这个表单展示了fo ...

  8. Django基础,Day5 - form表单投票详解

    投票URL polls/urls.py: # ex: /polls/5/vote/ url(r'^(?P<question_id>[0-9]+)/vote/$', views.vote, ...

  9. form表单基础知识

    form 元素是块级元素 ------------------- ------------------- ----------------------------------------------- ...

随机推荐

  1. JAVA RPC 生产级高可用RPC框架使用分享

    先放出链接,喜欢的给个star:https://gitee.com/a1234567891/koalas-rpc 一:项目介绍 koalas-RPC 个人作品,提供大家交流学习,有意见请私信,欢迎拍砖 ...

  2. elasticsearch shield在java中的应用

    官方文档:https://www.elastic.co/guide/en/shield/current/_using_elasticsearch_java_clients_with_shield.ht ...

  3. iOS开发系列--地图与定位总结

    现在很多社交.电商.团购应用都引入了地图和定位功能,似乎地图功能不再是地图应用和导航应用所特有的.的确,有了地图和定位功能确实让我们的生活更加丰富多彩,极大的改变了我们的生活方式.例如你到了一个陌生的 ...

  4. 感知机与BP神经网络的简单应用

    感知机与神经元 感知机(Perceptron)由两层神经元组成(输入层.输出层),输入层接收外界输入信号后传递给输出层,输出层是M-P神经元,亦称“阈值逻辑单元”(threshold logic un ...

  5. Mac下持续集成-与JMeter与Ant执行后自动发送邮件的整合+定时任务

    mac定时任务的开启: Last login: Tue Aug 13 22:49:54 on ttys004 (base) localhost:~ ligaijiang$ sudo launchctl ...

  6. 使用.NET Framework开发IIS 7.0模块和处理程序拦截请求实现跳转

    扩展IIS的两种方法:模块与处理程序. 模块,类似于以前的IIS版本中的ISAPI筛选器,它参与每个请求处理.IIS中一些现成的模块包括身份验证模块(用于处理请求的身份验证状态),压缩模块(用于压缩返 ...

  7. C++内容记录

    仅个人记录 https://ke.qq.com/course/336509 M了个J - 博客园 https://www.cnblogs.com/mjios/

  8. Qt编写自定义控件28-颜色滑块面板

    一.前言 相比于上一个颜色按钮面板,此控件就要难很多,颜色值有三种表示形式,除了程序员最常用的RGB以外,还有HSB和CMY方式. RGB色彩模式是工业界的一种颜色标准,是通过对红(R).绿(G).蓝 ...

  9. Qt编写数据可视化大屏界面电子看板4-布局另存

    一.前言 布局另存是数据可视化大屏界面电子看板系统中的额外功能之一,主要用于有时候用户需要在现有布局上做个微调,然后直接将该布局另存为一个布局配置文件使用,可以省略重新新建布局重新来一次大的调整的工作 ...

  10. sklearn常见分类器(二分类模板)

    # -*- coding: utf-8 -*- import pandas as pd import matplotlib matplotlib.rcParams['font.sans-serif'] ...