HTML基础教程:表单<form>详解与应用
"网页编程基础-HTML" HTML,全称HyperText Markup Language,即超文本标记语言,是用于创建网页的标准标记语言。它结合了超文本(包括文字、图片、音视频及链接等)和标记(浏览器根据这些标记来呈现内容)。HTML起源于标准通用标记语言SGML,并由W3C(World Wide Web Consortium)负责维护和发展,经历了从HTML1.0到HTML4.0的演变,以及后来的XHTML和现在的HTML5。 HTTP(HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议,用于在Web上传输信息。HTTP协议定义了客户端(浏览器)和服务器之间的通信格式,比如请求和响应的结构。常见的HTTP方法有GET和POST,GET用于获取资源,通常用于查询,其参数显示在URL中,而POST用于提交数据,如表单填写,数据量不受限制且不会在URL中显示。 FTP(File Transfer Protocol)则是一种用于在互联网上传输文件的协议,常用于网站文件的上传和管理。 HTML的基本框架由以下几部分组成: 1. `<html>`标签:整个HTML文档的根元素。 2. `<head>`标签:包含文档的元信息,如字符编码、样式表引用、页面标题等。 3. `<title>`标签:定义页面的标题,在浏览器的标签页中显示。 4. `<body>`标签:文档主体,包含用户在浏览器中能看到的所有内容。 HTML语法中的标记通常由一对尖括号包围,例如`<elementname>`,内容放在标记之间。有的标记如`<img>`是自闭合的,不需要结束标签。标记可以有属性,如`src`、`href`等,用来提供额外的信息。属性值应该使用引号包围,尽管不写引号有时也能解析,但为了规范和兼容性,应始终使用引号。在XHTML中,每个开始标签都必须有对应的结束标签,且不允许标签嵌套,例如`<font>`和`<b>`不能相互嵌套。 在表单基础中,`<form>`标签用于创建HTML表单,允许用户输入数据。`<form>`的`method`属性定义数据提交的方式,GET和POST是最常见的。GET发送的数据量有限,且会显示在URL,而POST则没有大小限制且数据对用户不可见。`enctype`属性定义数据的编码类型,如`multipart/form-data`用于文件上传。`action`属性指定处理表单数据的服务器端程序或页面,如`<form method="post" action="user.jsp">`表示数据将通过POST方式发送到user.jsp处理。 HTML是构建网页内容的基础,表单则是用户与网页交互的重要工具。了解并掌握这些基础知识对于任何Web开发人员都是至关重要的。
在如下代码中新增一个验证码表单:<template> <a-typography-title :level="3"> 新特能源还原炉群控平台 </a-typography-title> <a-form class="form mt-16" ref="formRef" :model="formState" :rules="rules" v-bind="layout"> <a-form-item class="form-item" has-feedback name="username"> <a-input class="input" v-model:value="formState.username" type="text" @keyup.enter="onSubmit()" placeholder="请输入用户名" autocomplete="off" allow-clear /> </a-form-item> <a-form-item class="form-item" has-feedback name="password"> <a-input class="input" v-model:value="formState.password" type="password" @keyup.enter="onSubmit()" placeholder="请输入登录密码" autocomplete="off" allow-clear /> </a-form-item> <a-button class="login-button mt-24" type="primary" size="large" block @click="onSubmit()">登录</a-button> </a-form> @2021-2023 中科时代(北京)科技有限公司 版权所有 京ICP备2021032638号-4
</template>
@2021-2023 中科时代(北京)科技有限公司 版权所有 京ICP备2021032638号-4
<form th:action="@{/file/upload}" method="post" enctype="multipart/form-data">
<input type="file" name="file" multiple="multiple" /> |
<input type="submit" value="提交"/> |
- 粉丝: 24
- 资源: 2万+
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- 李兴华Java基础教程:从入门到精通
- U盘与硬盘启动安装教程:从菜鸟到专家
- C++面试宝典:动态内存管理与继承解析
- C++ STL源码深度解析:专家级剖析与关键技术
- C/C++调用DOS命令实战指南
- 神经网络补偿的多传感器航迹融合技术
- GIS中的大地坐标系与椭球体解析
- 海思Hi3515 H.264编解码处理器用户手册
- Oracle基础练习题与解答
- 谷歌地球3D建筑筛选新流程详解
- CFO与CIO携手:数据管理与企业增值的战略
- Eclipse IDE基础教程:从入门到精通
- Shell脚本专家宝典:全面学习与资源指南
- Tomcat安装指南:附带JDK配置步骤
- NA3003A电子水准仪数据格式解析与转换研究
- 自动化专业英语词汇精华:必备术语集锦