标签相关内容可参考 HTML中表格的实例应用 一文。
部分:form在网页中主要负责数据采集功能。
一个表单有三个基本组成部分:
(1)表单标签:包含了解决表单数据所用CGI程序的URL以及数据提交到服务器的方法。
(2)表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。
(3)表单按钮:提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者者取消输入。还可以用表单按钮来控制其余定义了解决脚本的解决工作。
标签
定义:
标签规定客户可输入数据的输入字段。
根据不同的 type 属性,输入字段有多种形态。输入字段可以是文本字段、复选框、密码字段、单选按钮、按钮等等
语法代码:
实例代码:
关系展现:
中 submit属性 和reset属性
实例代码:
实例展现:
标签的其余属性值:
标签外能否增加标签?
input标签外能否增加form标签需要按情形区分:
应用场景的区别:
1.所有向后端提交数据(包括原生和ajax提交)的都建议用包裹.
2.假如只是用来做前端交互效果则不推荐使用form包裹。
但提交数据时,其实也可以不用form包裹input标签:
1.假如有form标签,在点击提交铵钮时,浏览器自动收集参数,并打包一个http请求到服务器,完成表单提交。在这一过程中,浏览器会根据method的不同,将参数编码后,放在urI中(get),或者者放在请求的data中(post)。而后发送到服务器。
2.假如没有form,post方式的提交要使用ajax手工完成。get方式的提交需要自己拼接url。表单其余相关内容可参考 HTML中 表单 的应用实例 一文。
最后,附带一下该可输入的EXCEL表格的源码。
HTML code:Make a Table Frame电脑配件管理表2018年5月-8月
5月
6月
7月
8月
Hard Disk
Mainboard
Case
Power
CPU Fan
Total
CSS code :body
{
font-family: Arial;
/*background-image: url(image/mainroad.jpg) no-repeat;*/
background-color: #00ff00;
background-size: 100%;
}
table.formdata
{
width: 300px;
height: 150px;
border: 2px solid #F00;
border-collapse: collapse;
font-family: Arial;
}
table.formdata caption
{
text-shadow: #FF00ff;
text-align: center;
padding-bottom: 6px;
font-weight: bold;
}
table.formdata th
{
border:1px solid #be34hc;
background-color: #E2E2E2;
color:#000000;
text-aglin:center;
font-weight: normal;
padding: 2px 8px 2px 6px;
margin: 0px;
}
table.formdata input
{
width: 100px;
padding: 1px 3px 1px 3px;
margin: 0px;
border:none;
font-family: Arial;
}
.btn
{
width:100px;
background-color: #FF00ee;
border:1px solid #00f2f2;
font-family: Arial;
}
本文部分内容来自网络,如有侵权,请联络修改。
全部评论(0)
最新发布的资讯信息
【系统环境|windows】字节跳动前台面试题解析:盛最多水的容器(2021-03-20 21:27)
【系统环境|windows】DevOps敏捷60问,肯定有你想理解的问题(2021-03-20 21:27)
【系统环境|windows】字节跳动最爱考的前台面试题:JavaScript 基础(2021-03-20 21:27)
【系统环境|windows】JavaScript 的 switch 条件语句(2021-03-20 21:27)
【系统环境|windows】解决 XML 数据应用实践(2021-03-20 21:26)
【系统环境|windows】20个编写现代CSS代码的建议(2021-03-20 21:26)
【系统环境|windows】《vue 3.0探险记》- 运行报错:Error:To install them, you can run: npm install --save core-js/modules/es.arra...(2021-03-20 21:24)
【系统环境|windows】浅谈前台可视化编辑器的实现(2021-03-20 21:24)
【系统环境|windows】产品经理入门迁移学习指南(2021-03-20 21:23)
【系统环境|windows】初识webRTC(2021-03-20 21:23)