表单标签的属性：
　　用于向服务器传输数据
　　表单能够包含input元素，比如文本字段，复选框，单选框，提交按钮等等
　　表单还可以包含textarea（简介之类的），select（下拉），fieldset和label元素

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link>

</head>

<body>

<form action="https://www.sogou.com/web">

    <!--action后面跟数据的发送终端地址-->

    用户名<input type="text" name="query">

    <!--name起的作用是将发送给服务端数据起键值对的作用，方便提取-->

    <input type="submit" value="点击提交">

<!--submit起到提交作用，value起提示作用-->

</form>

</body>

</html>

　　结果如图

当点击了提交之后，就弹到了

这是因为在搜狗搜索引擎里面提交的键值对分别是query和一个搜索字

如图

2、提交方式

表单主要有两种提交方式：post/get,默认是get
　　get：提交的键值对，放在url后面，安全性较差，长度有限制
　　post：提交的键值对不在地址栏，安全性相对较高，提交内容理论上无限制

3、input的其他标签

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link>

</head>

<body>

<form action="https://www.sogou.com/web" method="post" enctype="multipart/form-data">

    <!--action后面跟数据的发送终端地址,发送文件时要声明multipart/form-data-->

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

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

    <input type="submit" value="点击提交">

<!--submit起到提交作用，value起提示作用-->

相别

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

<!--radio是单选框,value起提示作用，传送到数据库的数据-->

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

兴趣

    <p>篮球<input type="checkbox" name="hobby" value="1"></p>

    <p>足球<input type="checkbox" name="hobby" value="2"></p>

    <p>排球<input type="checkbox" name="hobby" value="3"></p>

    <p>看书<input type="checkbox" name="hobby" value="4"></p>

    <p>旅游<input type="checkbox" name="hobby" value="5"></p>

<!--这是复选-->

按钮

    <p>

        <input type="button" value="我是一个按钮">

    </p>

    <input type="file" value="I am a file">

<!--file可以上传文件给服务端-->

</form>

</body>

</html>

　　结果如图

4、

其他表单标签

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<select name="language" multiple="multiple" size="3" >

        <!--要放在option里面,multiple表示可以多选,size means the most you can choose-->

    <optgroup label="语言学习1" >

        <!--这是分组了-->

        <option value="1">C</option>

        <option value="2">java</option>

        <option value="3">python</option>

    </optgroup>

        <!--要放在option里面,multiple表示可以多选,size means the most you can choose-->

    <optgroup label="语言学习2">

        <option value="1">Chinese</option>

        <option value="2">English</option>

        <option value="3">French</option>

    </optgroup>

        <!--要放在option里面,multiple表示可以多选,size means the most you can choose-->

    <optgroup label="语言学习3">

        <option value="1">mechine learning</option>

        <option value="2">deep learning</option>

        <option value="3">学个屁</option>

    </optgroup>

</select>

<br>

备注<textarea name="text" ></textarea>

<!--添加文档-->

<br>

<label for="www">姓名</label>

<input id="www" type="text">

<!--将文本和输入框链接起来，点击文本就可以进入输入框-->

<fieldset>

    <legend>登录吧</legend>

    <!--加个框框-->

    <input type="text">

</fieldset>

　　结果如图

html之表单标签的更多相关文章

  1. SpringMVC 表单标签 & 处理静态资源

    使用 Spring 的表单标签 通过 SpringMVC 的表单标签可以实现将模型数据中的属性和 HTML 表单元素相绑定,以实现表单数据更便捷编辑和表单值的回显. form 标签 一般情况下,通过 ...

  2. SpringMVC学习系列（11） 之 表单标签

    本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图上展示WebModel中的数据更加轻松. 一.首先我们先做一个简单了例子来对Spring MV ...

  3. (转载)SPRINGMVC表单标签简介

    SpringMVC表单标签简介 在使用SpringMVC的时候我们可以使用Spring封装的一系列表单标签,这些标签都可以访问到ModelMap中的内容.下面将对这些标签一一介绍. 在正式介绍Spri ...

  4. 第五节：表单标签的用法——value绑定和修饰符

    1.表单标签的用法--value绑定和修饰符 value绑定的写法:v-bind:value 或者简写 :value 修饰符: lazy , Number , trim . 用法如:  v-model ...

  5. 第四节：Vue表单标签和组件的基本用法，父子组件间的通信

    vue表单标签和组件的基本用法,父子组件间的通信,直接看例子吧. <!DOCTYPE html> <html> <head> <meta charset=&q ...

  6. SpringMVC 表单标签

    引入标签库 <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" ...

  7. SpringMVC表单标签简介

    在使用SpringMVC的时候我们可以使用Spring封装的一系列表单标签,这些标签都可以访问到ModelMap中的内容.下面将对这些标签一一介绍. 在正式介绍SpringMVC的表单标签之前,我们需 ...

  8. struts2：非表单标签

    非表单标签主要用于输出在Action中封装的信息,这在实际运用中是很常见的. 1. actionerror标签 <s:actionerror>标签主要用于输出错误信息到客户端,该标签将Ac ...

  9. [原创]java WEB学习笔记62：Struts2学习之路--表单标签:form,表单标签的属性，textfield, password, hidden，submit ，textarea ，checkbox ，list, listKey 和 listValue 属性，select ，optiongroup ，checkboxlist

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  10. Struts2的标签库（五）——表单标签

    Struts2的标签库(五) --表单标签 几个特殊的表单标签的使用: 1.checkboxlist标签 该标签用于创建多个复选框,用于同时生成多个<input type="check ...

随机推荐

  1. HDU5124 lines

    离散化 + 树状数组. 这些东西自己都是刚接触不久的,所以需要多写点题练练手. 题目描述: 一维坐标中有N条线段,其中有一个点上面覆盖的线段数是最多的,求该点上面的线段数目. 这道题和HDU1556特 ...

  2. coursera 算法二 week 1 wordnet

    这周的作业可谓是一波三折,但是收获了不少,熟悉了广度优先搜索还有符号图的建立.此外还知道了Integer.MAX_VALUE. SAP: 求v和w的大概思路是对v和w分别广度优先搜索,然后遍历图中每一 ...

  3. linux 命令——48 watch (转）

    watch是一个非常实用的命令,基本所有的Linux发行版都带有这个小工具,如同名字一样,watch可以帮你监测一个命令的运行结果,省得你一遍遍的手动运行.在Linux下,watch是周期性的执行下个 ...

  4. Netweaver和CloudFoundry里的trace开关

    Netweaver 事务码SU01的参数设置里,有很多关于trace(跟踪)的开关. FPTRACELEVEL: 设成04后,能将ADS生成PDF的trace信息写入生成的PDF. 详细原理参考我的b ...

  5. IOS 某个控件出不来原因（经验分享）

    某个控件出不来:(检查原因) 1.frame的尺寸和位置对不对 2.hidden是否为YES 3.有没有添加到父控件中 4.alpha 是否 < 0.01 5.被其他控件挡住了 6.父控件的前面 ...

  6. 【洛谷2216】[HAOI2007] 理想的正方形（二维RMQ）

    点此看题面 大致题意: 求出一个矩阵中所有\(n*n\)正方形中极差的最小值. 另一种做法 听说这题可以用单调队列去做,但是我写了一个二维\(RMQ\). 二维\(RMQ\) \(RMQ\)相信大家都 ...

  7. display:inline-block解决文字有间隙问题

    定义:display:inline-block是使元素以块级元素的形式呈现在行内.意思就是说,让这个元素显示在同一行不换行,但是又可以控制高度和宽度,这相当于内联元素的增强. 但是display:in ...

  8. JSPatch - iOS 动态补丁

    JSPatch库,支持在线更新iOS应用,目前BDN项目中有用到,主要用来修复线上Crash和Bug 相关博文推荐: JSPatch – 动态更新iOS APP(这是JSPatch作者的博文) JSP ...

  9. js display， visible 区别

    注意: display:none和visible:hidden都能把网页上某个元素隐藏起来,在视觉效果上没有区别,但是在一些DOM操作中两者有区别: display:none ---不为被隐藏的对象保 ...

  10. 2018.11.3 Nescafe18 T2 太鼓达人

    题目 背景 七夕祭上,Vani 牵着 cl 的手,在明亮的灯光和欢乐的气氛中愉快地穿行.这时,在前面忽然出现了一台太鼓达人机台,而在机台前坐着的是刚刚被精英队伍成员 XLk.Poet_shy 和 ly ...