html表单学习

最新推荐文章于 2023-07-14 19:00:42 发布
最新推荐文章于 2023-07-14 19:00:42 发布
阅读量105 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_53403791/article/details/117470422
版权

制作表单需要在表格的基础上用到两对标签，分别是：

  • form 标签中：action 中写提交之后跳往的网址；
  • input 标签：标签规定用户可输入数据的输入字段，type中定义文本类型（文本字段、复选框、密码字段、单选按钮、按钮等）

以下个人简历表单制作实例代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>个人简历</title>

</head>

<body>

    <div>

    <form>

        <table style="text-align: center;"border="1px" cellspacing="0">

        <thead></thead>

        <tbody>   

            <colgroup span="6" width="100px"></colgroup> 

            <colgroup span="1" width="200px"></colgroup>

            <tr height="40px">                          

                <th colspan="7">个人简历</th>            

            </tr>

                <tr height="40px">

                    <td>姓名</td>                             

                    <td><input type="text" name="xm" id=""></td>

                    <td>性别</td>

                    <td><input type="text" name="xb" id=""></td>

                    <td>出生年月</td>

                    <td><input type="text" name="nl" id=""></td>

                    <td rowspan="4" align="center"><input type="submit" value="选择照片"></td>                  <!--rowspan 设置把行合并-->

                </tr>

                <tr height="40px">

                    <td>民族</td>                             

                    <td><input type="text" name="xm" id=""></td>

                    <td>政治面貌</td>

                    <td><input type="text" name="xb" id=""></td>

                    <td>身高</td>

                    <td><input type="text" name="nl" id=""></td>

                </tr>

                <tr height="40px">

                    <td>学制</td>                             

                    <td><input type="text" name="xm" id=""></td>

                    <td>学历</td>

                    <td><input type="text" name="xb" id=""></td>

                    <td>户籍</td>

                    <td><input type="text" name="nl" id=""></td>

                </tr>

                <tr height="40px">

                    <td>专业</td>                             

                    <td><input type="text" name="xm" id=""></td>

                    <td colspan="2">毕业学校</td>

                    <td colspan="2"><input type="text" name="xb" id=""></td>

                </tr>

                <tr height="40px">                          

                    <th colspan="7"><b>技能，特长或爱好</b></th> 

                </tr>

                <tr height="40px">

                    <td>外语等级</td>                               

                    <td colspan="2"><input type="text" name="xm" id=""></td>

                    <td>毕业学校</td>

                    <td colspan="3"><input type="text" name="xb" id=""></td>

                </tr>

                <tr height="40px">                          

                    <th colspan="7"><b>个人履历</b></th> 

                    <tr height="40px">

                        <td>时间</td>  

                        <td colspan="2">单位</td>

                        <td colspan="4">经历</td>

                    </tr>

                    <tr height="40px">

                        <td><input type="text" name="xm" id=""></td>  

                        <td colspan="2"><input type="text" name="xm" id=""></td>

                        <td colspan="4"><input type="text" name="xm" id=""></td>

                    </tr>

                     <tr height="40px">

                        <td><input type="text" name="xm" id=""></td>  

                        <td colspan="2"><input type="text" name="xm" id=""></td>

                        <td colspan="4"><input type="text" name="xm" id=""></td>

                    </tr>

                    <tr height="40px">

                        <td><input type="text" name="xm" id=""></td>  

                        <td colspan="2"><input type="text" name="xm" id=""></td>

                        <td colspan="4"><input type="text" name="xm" id=""></td>

                    </tr>

                    <tr height="40px">                          

                    <th colspan="7"><b>联系方式</b></th> 

                </tr>

                <tr height="40px">

                    <td>通讯地址</td>                               

                    <td colspan="2"><input type="text" name="xm" id=""></td>

                    <td>联系电话</td>

                    <td colspan="3"><input type="text" name="xb" id=""></td>

                </tr>

                <tr height="40px">

                    <td>E-mail</td>                             

                    <td colspan="2"><input type="text" name="xm" id=""></td>

                    <td>邮编</td>

                    <td colspan="3"><input type="text" name="xb" id=""></td>

                </tr>

                <th colspan="7"><b>自我评价</b></th> 

                </tr>

                <tr height="240px">

                    <td colspan="7"> </td>                          

                </tr>                  

            </tbody>

            </table>

        </form>

    <div> 

</body>

</html>

 

qq_53403791
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
html 表单学习
hu20210623的博客
08-02 432
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登录注册</title> </head> <body> <h1>注册</h1> <!--表单form action :表单提交的位置，可以是网站，也可以是一个请求处理地址 method :post,get提交方式 get方式
前端学习 FreeCodeCamp html 注册表单
最新发布
03-20
本教程将聚焦于FreeCodeCamp提供的HTML注册表单的学习，旨在帮助初学者掌握创建交互式用户输入界面的核心技术。 首先，我们来看`index.html`文件。这个文件是网页的主要源代码，包含了所有HTML标记。一个基本的HTML...
html表单学习,HTML学习-------表单
weixin_30146171的博客
06-27 188
表单：是网页上的一个特定的区域，这个区域是由一对标记定义的。定义：元素(form 元素是块级元素，其前后会产生折行。)表单能够包含input 元素，比如文本字段、复选框、单选框、提交按钮等等。表单还可以包含menus、textarea、fieldset、legend和label 元素。表单用于向服务器传输数据。表单的属性：action属性：规定提交表单时，向何处发送数据语法：...name...
HTML学习之表单
chunlovenan的专栏
09-09 987
HTML表单 表单是HTML的一个重要部分，主要用于采集和提交用户输入的信息。   1、name：   设置表单的名称。   2、action：  设置表单的处理程序的URL。   3、method：提交表单的方法。 HTML    表单中常用的标记： 输入域一般在表单中使用 1、输入单行文字 2、输入密码 3、单选按钮 4、多选按钮 5、图片
html学习-表单
ujn12345的博客
10-14 285
表单
HTML表单学习笔记
thelight02的博客
03-08 153
HTML表单学习笔记 name属性 如果要正确地被提交，每个输入字段必须设置一个 name 属性。 输入类型 <input type="date">选择年月日 <input type="color">选择颜色 <input type="month">选择年月 <input type="time">选择时分 <input type="file"&...
HTML 学习总结2 框架 表单
01-08
在本文中，我们将深入探讨HTML中的框架（frames）和表单（forms）。 首先，我们关注框架。框架是HTML5之前的一个特性，用于将一个网页分割成多个独立的区域，每个区域可以加载不同的网页内容。框架通过`<frameset>`...
20.4 HTML 表单1
08-04
在网页设计中，HTML表单扮演着至关重要的角色，它们允许用户与网站进行互动，如填写信息、搜索内容、提交反馈等。本主题主要探讨“20.4 HTML 表单1”的相关知识点。 一、HTML表单基本结构 HTML表单通过`<form>`...
HTML学习笔记（五）——表单
01-08
HTML中的表单是网页设计中不可或缺的部分，它们用于收集用户数据，实现用户与网页的交互。表单在诸如用户注册、在线购物、联系方式提交等多种场景中广泛应用。HTML5对传统表单进行了重大改进，提供了更丰富的功能和...
表单结构与表单对象学习笔记
01-20
表单有两个重要组成部分：一是描述表单的HTML的源代码；二是用于处理用户在表单域中输入信息的服务器端应用程序或客户端脚本，如Asp、net、JSP、JavaScript 等。 二.基本语法： ... ... ... ... 1.单行文本输入框 ...
HTML网页表单学习（全方面详解）
qq_47897078的博客
12-15 1279
HTML网页表单 表单元素格式 属性 说明 type 指定元素的类型。text、password、checkbox、radio、submit、reset、file、hidden、image和button，默认为text name 指定表单元素的名称 value 元素的初始值。type为radio时必须指定一个值 size 指定表单元素的初始宽度。当type为text或password时，表单元素的大小以字符为单位。对于其他类型，宽度以像素为单位 maxlength type为
总结HTML表单学习
donghua-li的博客
07-09 1175
收集用户填写的信息并将其提交到后台服务器。 action属性：指定提交的地址 method属性：指定提交的方式，get/post get和post方式的区别：(1) 长度的限制，get方式限制为2k以内(2)安全性，get方式提交的数据会直接呈现在地址栏，敏感数据容易被截获 文本框 maxlength：指定文本框能接收的最大字符个数; size：指定文本框的大小（宽度）; v
HTML学习（三）表单
weixin_43868436的博客
04-29 173
HTML学习（三）表单 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>html表单</title> </head> <body> <!-- 下拉选择框--> <p>下拉...
HTML基础学习——表单（9.3）
mdyLjyCN的博客
05-04 358
input表单元素： submit： <!-- submit是提交按钮，可以把表单域中表单元素的值提交给后台服务器 默认显示为提交 可以通过value值来更改显示内容 --> <input type="submit" value="免费注册"> reset： <!-- reset是重置按钮 可以还原表单元素的初始默认状态 --> <input type="reset" value="重新填写"> button： <!-- button是
Html表单学习经典例子
小罗
08-15 616
登陆 账号： 密码: 性别：男 女 爱好：足球 篮球 隐藏： 下拉选择: 请选择 上海 广州 文本域： 这里输入
HTML学习日记（表单）
inputlife的博客
09-07 185
表单 ：注册、登录、个人信息记录... 基本结构 <form method="post" action="result.html"> <p> 名字：<input name="name" type="text" > </p> <p> 密码：<input name="pass" type="password" > </
html表单最全详解，初学必看
weixin_44992737的博客
06-07 4585
html表单标签，input元素，type详解
HTML——表单详解
热门推荐
wshwsh_的博客
07-14 1万+
HTML——表单的详细解析
HTML——表单知识点总结
TKY666的博客
02-25 2149
表单标签：这里面包含了处理表单数据所用程序的URL以及数据提交到服务器的方法。表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮：包括提交按钮、复位按钮和一般按钮。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值