HTML表单的使用

最新推荐文章于 2024-08-12 21:44:16 发布
最新推荐文章于 2024-08-12 21:44:16 发布
阅读量68 收藏
点赞数 1
文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43668733/article/details/129097808
版权

在这里插入图片描述

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>HTML表单</title> 
</head>
<body>

<form action="https://www.baidu.com/">
<!-- textbox短文本框，分别是文字类型和密码类型，size是框的宽度 -->
<span style="text-align: right">用户名: </span><input type="text" name="firstname" size="20"><br>
<span style="text-align: right">密码: </span><input type="password" name="lastname" size="30"><br>
<!-- 单选按钮 -->
<input type="radio" name="sex" value="male">男<br>
<input type="radio" name="sex" value="female">女<br>
<!-- 多选按钮 -->
<input type="checkbox" name="vehicle" value="bike">自行车<br>
<input type="checkbox" name="vehicle" value="car" checked="checked">汽车<br>
<!-- textarea是有长和宽的文本域，然后跟的文字是文本框里默认显示的文字，和input的text文本框区分开 -->
<textarea rows="10" cols="30" name="wenzi">我是一个文本框。</textarea>
<!-- button按钮类型，value是按钮上的文字 -->
<input type="button" value="按钮1">
<!-- 提交按钮类型，value是按钮上的文字，提交后url网址加上这个form表单里所有name（必须有name才能提交）属性的value值，其中action是点击"提交"按钮，表单数据将被发送到服务器上的action=“demo-form.php”，
    在这将action定义为baidu，form不定义默认是get方法。https://www.baidu.com/?firstname=a&lastname=&sex=female&vehicle=bike&vehicle=car&wenzi=I+am+textbox. -->
<input type="submit" value="提交">
</form>
<!-- fieldset相当于设置groupbox，legend里面的文字是groupbox的标题 -->
<form method="post">
    <fieldset>
      <legend>Title</legend>
      <input type="radio" name="radio"> Select me
    </fieldset>
</form>
<!-- select是下拉菜单选择，设置selected是默认选中项 -->
<form action=""> 
    <select name="cars">
        <option value="aodi">奥迪</option>
        <option value="dazhong" selected>大众</option>
        <option value="baoma">宝马</option>
    </select>
</form> 

<h3>发送邮件到 111@qq.com:</h3>
<form action="MAILTO:111@qq.com" method="post" enctype="text/plain">
    Name:<br>
    <input type="text" name="name" value="名字"><br>
    E-mail:<br>
    <input type="text" name="mail" value="邮箱"><br>
    Comment:<br>
    <input type="text" name="comment" value="内容" size="50"><br><br>
    <input type="submit" value="发送">
    <input type="reset" value="重置">
</form>

<p><b>注意：</b> 
    <ul>
        <li>表单本身是不可见的。并且注意一个文本字段的默认宽度是20个字符。</li>
        <li>value 属性规定元素的值</li>
        <ol>
            <li>对于 "button"、"reset"、"submit" 类型 - 定义按钮上的文本</li>
            <li>对于 "text"、"password"、"hidden" 类型 - 定义输入字段的初始（默认）值</li>
            <li>对于 "checkbox"、"radio"、"image" 类型 - 定义与 input 元素相关的值，当提交表单时该值会发送到表单的 action URL</li>
        </ol>
    </ul>
</p>

</body>
</html>
半夏花开°
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
简单的学生档案页面（基础的HTML表单使用）
wei257的博客
07-03 3777
本次目标: 一、基础知识 1.form（表单域）：在HTML中，form标签被用于定义表单域，即创建一个表单，以实现用户信息的收集和传递，form中的所有内容都会被提交给服务器。创建表单的基本语法格式如下： <form action="URL地址" method="提交方法" name="表单名字"> 内容 </form> 常用属性： action：用...
html form 表单
且听风吟的博客
07-15 5962
html form 表单
Html的表单
热门推荐
wenqi1的博客
08-21 3万+
一、表单基础内容： 表单一般使用form标签包裹，每一个表单选项都用input表示 text表示明文文本框， password表示暗文文本框， radio表示单选， checkbox表示复选框， check = "chcked"表示默认选择，应用于单选和复选 button表示按钮，value表示按钮的名字 reset表示重置按钮 image表示图片 submit表示提交，value表示提交键的名字 date表示日期 email表示邮箱 number表示数字 &nbsp;表
HTML——表单详解
wshwsh_的博客
07-14 1万+
HTML——表单的详细解析
HTML 表单制作
千寻的博客
09-19 2万+
HTML 表单 用于收集不同类型的用户输入。 表单是一个包含表单元素的区域 表单元素是允许用户在表单中输入内容, 比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等 表单使用表单标签 来设置 HTML 表单-输入元素 多数情况下被用到的表单标签是输入标签（）。 输入类型是由类型属性（type）定义的。 文本域（Text Fie...
编写注册表单 HTML
一七
03-28 3598
通过编写一个注册页学习 HTML 表单学习如何控制人们在表单中可以输入的数据类型，以及使用一些新的 CSS 工具装饰页面
html表单提交
THE ORDER
02-02 8386
1. 表单属性设置 <form>标签 表示表单标签，定义整体的表单区域 action属性 设置表单数据提交地址 method属性 设置表单提交的方式，一般有“GET”方式和“POST”方式, 不区分大小写 2. 表单元素属性设置 name属性 设置表单元素的名称，该名称是提交数据时的参数名 value属性 设置表单元素的值，该值是提交数据时参数名所对应的值 3. 示例代码 <form action="https://www.baidu.com" method="GET">
HTML登录表单
hzp666的博客
11-28 7387
注册和登录基本上是每一个网站都会有的功能，那么如何让用户在注册和登录这个环节上有更好的用户体验呢？随着现代浏览器的发展，我们就可以用HTML5和CSS3来制作炫酷的注册登录表单，下面我们收集了9款大气实用的HTML5/CSS3注册登录表单，希望你会喜欢。 1、HTML5/CSS3仿Facebook登录表单 利用CSS3制作的登录表单的确很漂亮，我们在html5tricks网站上也分享过
HTML进行表单验证
wr456wr的博客
11-24 5558
文章目录使用JavaScript进行表单验证使用html5自带的特性进行验证： 使用JavaScript进行表单验证 表单样式： <form action="" name="form_login"> <input placeholder="账号" type="text" name="username" class="form_input"> <br> <input placeholder="密码
HTML表格表单制作
weixin_41534129的博客
02-28 7358
1.数据表格的作用及组成 作用：显示数据，展示数据 组成： <table>用于定义表格的标签 <tr>行 <th>内容<th>表头单元格 <td>内容</td>单元格 <td>内容<td>单元格 .... <tr> </table> 1.<table&gt...
HTML 表单使用方法
12-18
HTML 表单使用方法 表单是网页中提供的一种交互式操作手段，在网页中的使用十分广泛。无论是提交搜索的信息，还是网上注册等都需要使用表单。用户可以通过提交表单信息与服务器进行动态交流。表单主要可以分为两部分...
html表单使用.docx
09-26
了解如何有效地使用HTML表单对于创建功能完善的网页至关重要。 一、表单控件 表单控件是用户与表单交互的元素，包括输入框、按钮、复选框、单选按钮、下拉列表和多行文本输入等。以下是一些常见的表单控件： 1. `...
纸箱预订表单HTML模板
04-08
此外，模板可能还结合了JavaScript，实现动态交互功能，如验证用户输入、提交表单时的数据校验，甚至可能使用AJAX异步提交表单，提升用户体验。如果涉及到服务器端交互，可能还需要配合PHP、Node.js等后端语言处理...
html中表单提交的实现
09-22
表单提交是常见的一种操作，这篇文章主要介绍了html中表单提交的实现，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
使用 HTML5 轻松验证表单
03-11
快速提示：使用 HTML5 轻松验证表单,当您通过表单从人们那里收集信息时，必须应用某种验证。如果不这样做，可能会导致客户流失、数据库中的垃圾数据甚至网站的安全漏洞。从历史上看，构建表单验证一直很痛苦。在...
创建一个简单的贪吃蛇游戏：HTML、CSS和JavaScript教程
Mr_Zhangyuge的博客
08-08 1536
在本教程中，我们将逐步构建一个简单的贪吃蛇游戏。这个项目适合初学者，可以帮助你理解HTML、CSS和JavaScript的基础知识，并掌握如何将它们结合起来创建一个完整的游戏。
html--前端
m0_60274660的博客
08-07 361
只有body中的标签的内容才会输出到中断；如果要看script标签中的javascript代码的输出，需要按F12,点击Console查看。
HtmlUnit：探索Web自动化的强大工具
Aaron_945的博客
08-12 569
HtmlUnit 是一个开源的“无头”（headless）浏览器，它模拟了浏览器环境，允许开发者在不需要实际浏览器界面的情况下执行JavaScript、CSS、DOM操作以及HTTP请求。它模拟了浏览器的许多方面，包括DOM操作、CSS选择器、AJAX请求等，使得开发者可以在服务器端或无需图形界面的环境中执行Web应用程序的自动化测试。通过模拟浏览器的行为，HtmlUnit使得开发者能够在无需实际浏览器界面的情况下执行复杂的Web操作。对于AJAX请求，HtmlUnit提供了。
html复习
m0_73280507的博客
08-12 619
Jsonp是前端程序员为了解决跨域问题，提出的一种解决拌饭，只支持get请求，不支持post请求，jnonsp是实现定义一个用于获取跨域响应数据的回调函数，通过没有同源策略限制的script标签发起的一个请求，将回调函数的名称放到这个请求的query参数中，然后服务端返回这个回调函数的执行，并将需要响应的数据放到回调函数的参数里，前端的script标签请求到这个执行的回到函数中立马执行，于是就拿到了执行的响应数据。控制首页链接数量， 网站首页不能有太多的链接，也不能有太少的链接。外链选择，友站友情链接。
html实现funnel图
最新发布
Debug yourself!
08-12 590
这些方法中，使用JavaScript库（如ECharts）是最强大且灵活的，可以处理复杂的数据和交互。如果只是简单的静态漏斗图，CSS方法也可以满足需求。这是最简单和推荐的方式，因为这些库提供了内置的漏斗图功能，并且可以高度自定义。如果你不想依赖外部库，可以使用纯HTML和CSS来实现一个简单的漏斗图。你还可以使用SVG（矢量图形）直接绘制漏斗图。// 使用刚指定的配置项和数据显示图表。// 初始化echarts实例。// 指定图表的配置项和数据。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值