HTML表单

最新推荐文章于 2024-01-01 08:00:00 发布
最新推荐文章于 2024-01-01 08:00:00 发布
阅读量198 收藏
点赞数
分类专栏： HTML入门 CSS自学笔记 文章标签： HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36818386/article/details/81050087
版权

    用HTML写个简单的表单

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .l
        {
            background-color: darkolivegreen;
            width: 200px;
            height: 40px;
        }
        input
        {
            width: 300px;
        }
        .m
        {
            width: 30px;
        }
        .mf
        {
            width: 100px;
        }
    </style>
</head>
<body>
    <form method="get">
        <lable>
            *邮件地址 <input type="email" placeholder="6~18个字符,可使用字母,数字,下划线,需以字母开头"> @
            <select>
                <option value="">163.com</option>
                <option selected="selected">qq.com</option>
                <option value="">sina.com</option>
            </select>
        </lable>
        <br> <br>
        <lable>
                   *密码  <input type="password" placeholder="6~16个字符,区分大小写">
        </lable>
        <br> <br>
        <lable>
            *确认密码 <input type="password" placeholder="请再次填写密码">
        </lable>
        <br> <br>
        <lable>
            *手机号码 <input type="tel" placeholder="忘记密码时,可以通过手机号快速找回">
        </lable>
        <br> <br>
        <lable>
               *验证码  <input type="text" placeholder="请先填写图中的字符,不区分大小写">
            <br>
            <br>
                           
            <input type="submit" value="免费获取验证码" class="mf">
        </lable>
        <br> <br>
        <lable>
            *短信验证码 <input type="text" placeholder="请查收手机短信,并填写短信中的验证码">
            <br> <br>
                         
            <input type="checkbox" class="m">同意"服务条款"和"隐私相关政策"
        </lable>
        <br> <br>
        <lable>
                         
            <input type="submit" value="立即注册" class="l">
        </lable>
        
    </form>
</body>
</html>

 

效果：

 

 

有什么问题欢迎留言！~~~~~

 

 

 

丸子哥哥
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
20.4 HTML 表单1
08-04
在网页设计中，HTML表单扮演着至关重要的角色，它们允许用户与网站进行互动，如填写信息、搜索内容、提交反馈等。本主题主要探讨“20.4 HTML 表单1”的相关知识点。 一、HTML表单基本结构 HTML表单通过`<form>`...
HTML中设置出生日期年月日下拉列表框及默认年月日
2301_77721393的博客
04-19 9866
哪一日年数年数月份月份
HTML实例--制作表单
zxn200125的博客
10-05 1万+
运用表格和表单基础知识简单制作一个表单 表单制作使用表格来对表单进行排版美化 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width...
HTML表格表单制作
weixin_41534129的博客
02-28 7340
1.数据表格的作用及组成 作用：显示数据，展示数据 组成： <table>用于定义表格的标签 <tr>行 <th>内容<th>表头单元格 <td>内容</td>单元格 <td>内容<td>单元格 .... <tr> </table> 1.<table&gt...
html表单制作及实例
最新发布
专注java二开部署
01-01 1604
这个表单包含了文本输入、电子邮件输入、密码输入、下拉列表和文本框等多种类型的输入。这个表单有两个文本输入字段（名和姓），一个提交按钮，当用户点击提交按钮时，数据会以POST方式发送到服务器的"/submit_form"地址。注意：这只是一个基本的表单，实际上你可能需要包含更多的HTML元素，例如复选框，下拉列表，单选按钮等，以及更复杂的验证和错误处理机制。除了上述的表单元素，HTML表单还可以包括一些用于验证用户输入的元素和特性。属性来定义一个正则表达式，以验证用户输入的数据是否符合特定的格式。
HTML --- 表单
naoguoteng的博客
10-12 1901
1.表单的用途2.表单的工作原理3.表单中的各种标签 表单标签 form、输入标签 input、文本文框标签 textarea、下拉框标签 select、按钮标签 button 4.表单实例 表单在网页上用来给访问者填写信息的，从而获得用户信息，使用网页进行交互的功能。就像日常生活中统计信息的信息表一样。一般是将表单设计在一个html页面中，当用户填写信息后做提交操作，于是表单的内容就会从客户端的浏览器上发送给服务器，经过服务器上的jsp或者ASP或者Cgi等处理后，再将用户所需的信息传送给客户端的
深入理解html表单输入监听
09-28
下面小编就为大家带来一篇深入理解html表单输入监听。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
表单智能填充，数据复制到文本域，智能填充到表单，html表单提交
05-27
html，表单自动填充，避免重复性工作，一个一个填写，复制粘贴到文本域，自动识别对应表单属性，复制之后自动识别，点击提交就行了。超级简单，有什么不懂的可以直接私信问我。
HTML表单标记教程(3):输入标记
12-13
HTML表单标记教程,这节主要讲解如何在网页中使用INPUT标记,主要介绍INPUT标记的属性的使用. 输入标记<input>是表单中最常用的标记之一。常用的文本域、按钮等都使用这个标记。 基本语法 01 <Form> 02 &...
清除HTML表单问题
04-03
在网页开发中，HTML表单是用户与网页交互的重要元素，用于收集用户输入的数据。当涉及到表单数据的清除时，开发者可能会遇到一些问题。在这个场景中，标题"清除HTML表单问题"提示我们，讨论的重点是如何有效地清空或...
注册页面，年龄选择年月日下拉列表
07-19
注册页面经常用到的用户选择自己出生年月日所需的下拉列表，源码可运行，可能会有浏览器差异问题。重新编辑所需积分了。
一个输入框可以选择年月日
07-12
能够有效的限制用户输入的格式。并能手动选择要输入的年月日
h5时间控件 年月日
10-10
出生日期 年月日选择 h5 日历控件
html5 css3在线留言表单美化代码
11-05
html5 css3在线留言表单美化代码
asp.net获取HTML表单File中的路径的方法
10-26
主要介绍了asp.net怎么获取HTML表单File中的路径,需要的朋友可以参考下
HTML 表格 表单的制作
m0_60045654的博客
10-21 6594
表格是一种二维结构，横行纵列。表格由单元格组成。每一行有相同的列数（单元格），每一列有相同的行数（单元格）同一列的单元格，宽度（以最大的为准）相同，同列等宽；同行等高。从服务器角度讲，收集用户的输入数据。从客户端角度来讲，向服务器提交数据的位置。本站搜索<input type="submit" name="button" id="button" value="搜索"></form>
html实现用户注册页面（生日实现年月日的三级联动）
qq_38473254的博客
05-22 1万+
注册页面 期待效果如下： 代码实现： <!DOCTYPE html> <html> <head> <title>注册页面</title> </head> <body> <!-- 表单，用于提交按钮，隐式提交 --> <form action="" method="post"> <table border="0" width="500px" align="center" bgcolor="#
HTML基础之表单制作
热门推荐
TangJing_的博客
05-14 2万+
一、知识点 1、表单的作用： 信息的收集 数据的验证 在线考试 调查问卷 2、表单的构成 提示性文字：提示用户如何操作（一般由placeholder属性完成） 表单域：相当于一个容器，包含若干表单控件 表单控件：具体的功能项（按钮，下拉列表，输入框等） 3、表单域 <form action="远程服务器的URL(存放地址)" method="信息的提交方式" name="表单名"> 表单内容 </form> 4、表单控件 （1）input：输入框。都有val
html简要学习--- html 表单标签与表单设计
qq_51635297的博客
09-06 612
【代码】html简要学习--- html 表单标签与表单设计。
html表单
05-31
HTML表单是一个用户界面元素，它包含用于收集用户输入的各种表单元素，例如文本输入框、下拉列表、单选按钮、复选框等。当用户提交表单时，它将被发送到服务器进行处理。以下是一个简单的HTML表单示例： ```html <form action="/submit-form" method="POST"> <label for="name">Name:</label> <input type="text" id="name" name="name" required> <label for="email">Email:</label> <input type="email" id="email" name="email" required> <label for="message">Message:</label> <textarea id="message" name="message" required></textarea> <button type="submit">Submit</button> </form> ``` 这个表单包括三个表单元素：一个文本框、一个电子邮件输入框和一个文本区域，以及一个提交按钮。当用户点击提交按钮时，表单数据将被发送到服务器的“/submit-form”端点，使用POST方法。此外，每个表单元素都有一个“required”属性，这意味着用户必须填写它们才能提交表单。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

丸子哥哥

你的鼓励将是我创作的最大动力！

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值