HTML 表单

最新推荐文章于 2024-04-24 14:37:39 发布
最新推荐文章于 2024-04-24 14:37:39 发布
阅读量120 收藏
点赞数
分类专栏： web 文章标签： html forms
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_50777680/article/details/116767897
版权

HTML个人信息的表单

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width>, initial-scale=1.0">
    <title>用户登录</title>
</head>

<body>
    <form method="post" action="#">
        <table style="font-size:12px">
            <tr>
                <td align="right">姓名：</td>
                <td>
                    <input type="text" id="username" size="20" />
                </td>
            </tr>

            <tr>
                <td align="right">性别：</td>
                <td>
                    <input type="radio" id="sex" value="male" name="1" />男
                    <input type="radio" id="sex" value="female" name="1" />女
                    <!-- HTML的radio单选按钮实现男、女性别只能选择一个-->

                </td>
            </tr>

            <tr>
                <td align="right">籍贯：</td>
                <td>
                    <select name="country">
                        <option id="defualt" selected="selected">
                            -济南-
                        </option>
                        <option id="rizhao">日照</option>
                    </select>
                </td>
            </tr>

            <tr>
                <td align="right">年纪：</td>
                <td>
                    <select name="age">
                        <option id="defualt" selected="selected">
                            21~25
                        </option>
                        <option id="26~30">26~30</option>
                    </select>
                </td>
            </tr>

            <tr>
                <td align="right">爱好：</td>
                <td>
                    <input type="checkbox" name="interest" value="music" />音乐
                    <input type="checkbox" name="interest" value="physical" />体育
                    <input type="checkbox" name="interest" value="art" />美术
                </td>
            </tr>

            <tr>
                <td align="right">备注：</td>
                <td>
                    <textarea name="comments" rows="3" cols="50" />
                    </textarea>
                </td>
            </tr>

            <tr>
                <td colspan="2" align="center">
                    <input type="submit" value="提交" />&nbsp;&nbsp;
                    <input type="submit" value="取消" />
                </td>
            </tr>

            <tr>
                <td align="right">名字：</td>
                <td>
                    <input type="text" id="name" size="30" />
                </td>
            </tr>

            <tr>
                <td align="right">邮箱：</td>
                <td>
                    <input type="text" id="email" size="30" />
                </td>
            </tr>

            <tr>
                <td>
                    <textarea name="comments" rows="3" cols="50" align="center">
</textarea>
                </td>
            </tr>

            <tr>
                <td colspan="2" align="center">
                    <input type="submit" value="发送留言" />&nbsp;&nbsp;
                    <input type="submit" value="重写留言" />
                </td>
            </tr>


</body>

</html>

DUI
择友表单

<title>用户登录</title>
</head>

<body>
    <form method="post" action="#">
        <table style="font-size:12px">


            <tr>
                <td align="right">请选择您的择友条件</td>
            </tr>

            <tr>
                <td align="right">性别：</td>
                <td>
                    <input type="radio" id="sex" value="male" name="1" />男
                    <input type="radio" id="sex" value="female" name="1" />女
                    <input type="radio" id="sex" value="female" name="1" />不限
                </td>
            </tr>

            <tr>
                <td align="right">年纪：</td>
                <td>
                    <select name="age">
                        <option id="defualt" selected="selected">
                            21~25
                        </option>
                        <option id="26~30">26~30</option>
                    </select>
                </td>
            </tr>

            <tr>
                <td align="right">居住地区：</td>
                <td>
                    <select name="country">
                        <option id="defualt" selected="selected">
                            北京
                        </option>
                        <option id="rizhao">日照</option>
                    </select>
                </td>
            </tr>

            <tr>
                <td colspan="4" align="center">
                    <input type="submit" value="送出选择" />&nbsp;&nbsp;
                </td>
            </tr>

        </table>
    </form>
</body>

</html>

在这里插入图片描述
对齐问题有待解决

neymar116
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
HTML 表单和验证
weixin_44212853的博客
06-16 3238
必填：required。写在input上。鼠标聚焦：刷新时聚焦：autofocus。写在input上。点击提示文字，聚焦到输入框：标题和input 表单不验证，解除required等：表达验证：pattern=“正则表达式 ”历史记录联想：autocomplete=“on/off”表单下拉提示框:注意list="province"和id=“province” search伪类元素美化 number表单设置最大长度，无法使用maxlength等，以下使用js方法 设置步长:点击按
20.4 HTML 表单1
08-04
在网页设计中，HTML表单扮演着至关重要的角色，它们允许用户与网站进行互动，如填写信息、搜索内容、提交反馈等。本主题主要探讨“20.4 HTML 表单1”的相关知识点。 一、HTML表单基本结构 HTML表单通过`<form>`...
html 表单
weixin_64195420的博客
03-22 3368
input类型 用户框： // input 默认是text maxlength 表示可输入的最大字符数 // size 表示表单的初始元素 name 表示表单元素的名称 value 表示初始值（type值为radio 必须指定一个值） 密码框： //密码框 类型为password 密码框里面内容是加密的 单选框： //密码框 类型为radio radio单选框的value值一般用英文表示 checked 表示单选按钮选中状态 可以给...
HTML 表单制作
千寻的博客
09-19 2万+
HTML 表单 用于收集不同类型的用户输入。 表单是一个包含表单元素的区域 表单元素是允许用户在表单中输入内容, 比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等 表单使用表单标签 来设置 HTML 表单-输入元素 多数情况下被用到的表单标签是输入标签（）。 输入类型是由类型属性（type）定义的。 文本域（Text Fie...
HTML表单（详解网页表单如何实现）
最新发布
百赢出品，必属精品
04-24 2819
HTML 表单用于收集用户的输入信息。HTML 表单表示文档中的一个区域，此区域包含交互控件，将用户收集到的信息发送到 Web 服务器。HTML 表单通常包含各种输入字段、复选框、单选按钮、下拉列表等元素。元素用于创建表单，action属性定义了表单数据提交的目标 URL，method属性定义了提交数据的 HTTP 方法（这里使用的是 "post"）。元素用于为表单元素添加标签，提高可访问性。
HTML表单制作
jxcklfn的博客
05-25 2213
为什么写表单？（目的是为了收集用户信息） 表单的组成：表单域、表单控件（也称表单元素）和提示信息3个部分构成。 在HTML中，<form>标签用于定义表单域，以实现用户信息的收集和传递 <form>会把它范围内的表单元素信息提交给服务器 <form action=''url地址'' methid=''提交方式'' name=''表单域名称''> 各种表单元素的控件 </form> input输入表单元素 <input>标签.
html表单提交
THE ORDER
02-02 8382
1. 表单属性设置 <form>标签 表示表单标签，定义整体的表单区域 action属性 设置表单数据提交地址 method属性 设置表单提交的方式，一般有“GET”方式和“POST”方式, 不区分大小写 2. 表单元素属性设置 name属性 设置表单元素的名称，该名称是提交数据时的参数名 value属性 设置表单元素的值，该值是提交数据时参数名所对应的值 3. 示例代码 <form action="https://www.baidu.com" method="GET">
html表单
huangyh技术栈
08-30 7929
1.1 表单标签作用： 作用：将客户端的数据提交给服务器，（表单是客户与服务器交互的一种方式）。 可见性：在网页上是不可见的。 1.2 form常用的属性： form标签是表单标签的一个根标签。 常用属性 作用 action 提交给服务器的地址 method 提交数据给服务器的方式，主要有两种方式：GET（默认）或POST 1.3 GET与POS...
HTML 表单标签
weixin_45904557的博客
02-28 8063
一、什么是表单标签 表单是用来采集用户的输入数据，然后将数据提交给服务器 二、表单的组成 一个表单有三个基本组成部分： ①表单标签：这里面包含了处理表单数据所用程序的URL以及数据提交到服务器的方法。 ②表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。 ③表单按钮：包括提交按钮、复位按钮和一般按钮； 三、表单标签 表单标签＜form＞＜/form＞ 功能：用于申明表单，定义采集数据的范围，也就是＜form＞和＜/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表单标签与表单设计
z55947810的博客
04-17 4887
刚刚接触前端的HTML，练习并记录程序。 下面是对HTML表格的整理并总和在一起做的一个小练习。 IDE：VScode 主要框架是自动生成的，body内为自己编写内容。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="view...
深入理解html表单输入监听
09-28
下面小编就为大家带来一篇深入理解html表单输入监听。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
表单智能填充，数据复制到文本域，智能填充到表单，html表单提交
05-27
html，表单自动填充，避免重复性工作，一个一个填写，复制粘贴到文本域，自动识别对应表单属性，复制之后自动识别，点击提交就行了。超级简单，有什么不懂的可以直接私信问我。
HTML表单标记教程(3):输入标记
12-13
HTML表单标记教程,这节主要讲解如何在网页中使用INPUT标记,主要介绍INPUT标记的属性的使用. 输入标记<input>是表单中最常用的标记之一。常用的文本域、按钮等都使用这个标记。 基本语法 01 <Form> 02 &...
清除HTML表单问题
04-03
在网页开发中，HTML表单是用户与网页交互的重要元素，用于收集用户输入的数据。当涉及到表单数据的清除时，开发者可能会遇到一些问题。在这个场景中，标题"清除HTML表单问题"提示我们，讨论的重点是如何有效地清空或...
asp.net获取HTML表单File中的路径的方法
10-26
主要介绍了asp.net怎么获取HTML表单File中的路径,需要的朋友可以参考下
HTML表单传值示例通过get方式传递
12-13
HTML表单是网页中用于收集用户输入数据的重要元素，它允许用户与服务器进行交互。在本示例中，我们探讨了如何通过GET方法在HTML表单中传递值，并查看服务器如何接收这些值。 首先，让我们深入理解HTML表单的基本...
HTML 表单组件实例代码
09-28
本文通过实例代码给大家介绍了HTML 表单组件的知识，非常不错，具有参考借鉴价值，需要的朋友参考下吧
html表单制作及多种实例
11-09
本文将深入探讨HTML表单的制作及其多种实例，帮助你理解和掌握创建功能丰富的交互式网页表单的方法。 1. **HTML 表单基础** - `<form>` 标签：这是所有表单的起点和终点，通过`action`属性定义数据提交的目标URL，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值