表单练习一

最新推荐文章于 2024-11-01 13:37:44 发布
原创 最新推荐文章于 2024-11-01 13:37:44 发布 · 561 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。 

<!DOCTYPE html>
<html lang="cn">
<head>
    <meta charset="UTF-8">
    <title>表单信息</title>
</head>
<body>
    <h1>信息统计</h1>
    <!--使用ctrl+/可以快速进行注释，使用ctrl+shift+/可以快速进行块注释-->
    <!--表单必须要有name属性才能正常发送-->
    <!--1、action填写发送的目的地址，method填写发送方式,发送方式有两种，是get和post，-->
    <!--    1） get是从服务器上获取数据，post是向服务器传送数据。
        2） get是把参数数据队列加到提交表单的ACT搜索ION属性所指的URL中，值和表单内各个字段一一对应，在URL中可以看到。
        post是通过HTTP post机制，将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。
                用户看不到这个过程。
        3)  对于get方式，服务器端用Request.QueryString获取变量的值，对于post方式，服务器端用Request.Form获取提交
                的数据。
        4)  get传送的数据量较小，不能大于2KB。post传送的数据量较大，一般被默认为不受限制。但理论上，IIS4中最大量为80KB，
                IIS5中为100KB。
        5)  get安全性非常低，post安全性较高。但是执行效率却比Post方法好。
        建议：
        1、get方式的安全性较Post方式要差些，包含机密信息的话，建议用Post数据提交方式；
        2、在做数据查询时，建议用Get方式；而在做数据添加、修改或删除时，建议用Post方式；-->
    <from action="发送地址" method="post"></from>
    <!--文本输入框-->
    用户名：<input type="text" name="username" value="默认显示文字">
    <!--<br><br>     输入br*2后按tab键可以快速输入两个换行符-->
    密码：<input type="password" name="password" >
    <br><br>
    <!--单选按钮-->
    性别：男 <input type="radio" name="sex" value="1" checked="checked">
    女 <input type="radio" name="sex" value="0">
    <br><br>
    <!--单选按钮和复选按钮使用checked=“checked”表示默认选中状态-->
    <!--复选按钮-->
    爱好：篮球 <input type="checkbox" name="hobby[]" value="lanqiu" checked="checked">
    足球 <input type="checkbox" name="hobby[]" value="zuqiu" checked="checked">
    排球 <input type="checkbox" name="hobby[]" value="paiqiu">
    跑步 <input type="checkbox" name="hobby[]" value="paobu">
    音乐 <input type="checkbox" name="hobby[]" value="yinyue">
    电影 <input type="checkbox" name="hobby[]" value="dianying">
    游戏 <input type="checkbox" name="hobby[]" value="youxi">
    旅游 <input type="checkbox" name="hobby[]" value="lvyou">
    <br><br>
    <!--下拉列表，默认选中使用selected="selected"-->
    学历： <select name="xueli" >
        <!--输入option*5后按tab可以快速输入5行内容-->
        <option value="xiaoxue" >小学</option>
        <option value="chuzhong">初中</option>
        <option value="gaozhong">高中</option>
        <option value="daxue" selected="selected">大学</option>
        <option value="boshi">博士</option>
    </select>
    <br><br>
    <!--下拉列表同时显示多个内容可以使用size=""-->
    学历： <select name="xueli" size="3">
        <!--输入option*5后按tab可以快速输入5行内容-->
        <option value="xiaoxue" >小学</option>
        <option value="chuzhong">初中</option>
        <option value="gaozhong">高中</option>
        <option value="daxue" >大学</option>
        <option value="boshi">博士</option>
        <option value="xiaoxue" >小学</option>
        <option value="chuzhong">初中</option>
        <option value="gaozhong">高中</option>
        <option value="daxue" >大学</option>
        <option value="boshi">博士</option>
    </select>
    <br><br>
    <!--下拉列表使用multiple="multiple"进行多选-->
    学历： <select name="xueli" multiple="multiple" >
        <!--输入option*5后按tab可以快速输入5行内容-->
        <option value="xiaoxue" >小学</option>
        <option value="chuzhong">初中</option>
        <option value="gaozhong">高中</option>
        <option value="daxue" >大学</option>
        <option value="boshi">博士</option>
        <option value="xiaoxue" >小学</option>
        <option value="chuzhong">初中</option>
        <option value="gaozhong">高中</option>
        <option value="daxue" >大学</option>
        <option value="boshi">博士</option>
    </select>
    <br><br>
    头像： <input type="file">
    <br><br>
    个人简介： <textarea name="jianjie" >默认显示内容</textarea>
    <br><br>
    <!--提交按钮-->
    <input type="submit" value="按钮上显示的文本内容">
    <!--重置按钮-->
    <input type="reset">

</body>
</html>
表单练习HTML5
LaoXieyyds的博客
07-21 939
HTML5表单练习，基础部分
JavaScript表单练习.zip
12-23
1． 掌握JavaScript脚本的调用和基本语法； 2． 掌握JavaScript常用内置对象的基本应用； 3． 掌握BOM和window消息对话框的使用； 4． 掌握HTML DOM动态网页设计技术。
form.html（表单练习）
07-22
表单练习，账号text，密码password，性别单选框radio，爱好多选框checkbox，地址下拉列表select，文本域textarea，提交按钮submit
表单练习题
y261214的博客
10-17 677
使用学习到的表单标签，制作如下表单页面 工具：HBuilder X 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> body{ border:3px ...
表单练习
weixin_30485291的博客
09-07 183
做一个如下图的form表单： 　　 　　我们的代码如下： 　　　　 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.or...
微信小程序学习demo：表单练习(源代码+截图)
06-19
微信小程序学习demo：表单练习(源代码+截图)微信小程序学习demo：表单练习(源代码+截图)微信小程序学习demo：表单练习(源代码+截图)微信小程序学习demo：表单练习(源代码+截图)微信小程序学习demo：表单练习(源代码+...
表单练习.rar
10-23
"表单练习.rar"这个压缩包文件显然包含了一些关于表单设计的练习案例，这些案例可能包括了不同类型的表单，如申请表、调查问卷、网站注册页面和邮箱登录页面。下面将详细探讨这些知识点。 1. **申请表**： 申请表...
【练习】表单
最新发布
weixin_46245844的博客
11-01 571
效果图 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表单样式</title> <style> * { --selectColor: #dcdedf; --bodyBackGroundColor: #171d25; --bodyColor: #dcdedf;
表单作业练习
qq_45901759的博客
08-24 495
一、完成效果 二、代码段 <form action="formfr.php" method="GET"> <table bgcolor="#f2f2f2" align="center" width="500px"> <tr > <td align="right">姓名：</td> <td align="left"><input
form表单练习
weixin_45725778的博客
01-08 612
问题一：下拉列表中的请选择一个问题如何设置？ 答： <option value="none" selected disabled hidden>请选择</option> 问题二：个人介绍如何从文本域的左下角移动到左上角？ <style> textarea{ vertical-align: top; } </style> 问题三：如何将左对齐改为列表对齐？ 代码如下： ...
【HTML】表单练习
QiuBika_061的博客
12-21 719
编码实现如下图表： 代码： &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt...
制作表单练习
qq_46178261的博客
02-14 1117
制作如图所示表单 1.完整代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <ti...
表格，表单（练习）
setsunadoudou的博客
09-11 271
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body{...
表单练习（回顾）
weixin_30511107的博客
11-27 114
思维导图： 课表代码： <body> <table width="600" border="1" align='center' bordercolor="blue" rules='all'> <caption><b>课程表</b></caption> <tr> <...
HTML表单简单练习
weixin_33863087的博客
03-16 481
代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>表单</title> </head> <body bgcolor="deepskyblue"&...
html表单的练习
lyn789的博客
08-24 914
一个表单的练习， 这是在网页显示中的展示。 form.html 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
html表单练习
m0_51045721的博客
02-17 407
th和tr th：标题列 tr：普通的列 表单练习 <!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=.
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值