10.表单等的学习

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录注册</title>
</head>
<!--action:行动。method:方法。get:变得。post:邮政,职位,公布。input:输入。type:类型。text:书面材料、文本。max:最。length:长、长度。
size:大小。password:密码。value:重要的。sex:性别。-->
<body>

<h1>注册</h1>

<!--表单form

action:表单提交的位置,可以是网站;也可以是一个请求处理地址
method:post;get 提交方式
get方式提交:我们可以在url中看到我们提交的信息,不安全,高效
post方式提交:比较安全,传输大文件,
-->
<form action="1.我的第一个网页.html" method="get">

<!--文本输入框<input type="text"---所有input的标签我们都给它命name
value="狂神很厉害" 默认值,默认初始值。
maxlength="8" 最长能写几个字符
size="30" 文本框的长度
-->

<p>名字:<input type="text" name="username" value="狂神很厉害" maxlength="8" size="30"></p>

<!--密码框:input type="password"-->
<p>密码:<input type="password" name="pwd"></p>

<!--单选框标签
input type=“radio”
value:单选框的值
name:组
-->

<p>性别:
<input type="radio"value="boy" name="sex"/checked> 男
<input type="radio"value="girl" name="sex2"/> 女
</p>


<!--多选框
input type=“check box”
-->
<p>爱好:
<input type="checkbox"value="sleep"name="hobby">睡觉
<input type="checkbox"value="code"name="hobby"checked>敲代码
<input type="checkbox"value="chat"name="hobby">聊天
<input type="checkbox"value="game"name="hobby">游戏
</p>
<!--按钮
input type="button":普通按钮
input type="image":图像按钮
input type="submit":提交按钮
input type="reset":重置
-->
<p>按钮:
<input type="button"name="btn1"value="点击边长">
<!-- <input type="image"src="../resources/image/1.jpg">-->
</p>


<!--下拉框,列表框-->

<p>国家:
<!--<select name="" id="id可去掉"></select>-->
<!--selected默认值-->
<select name="列表名称" id="">
<option value="China">中国</option>
<option value="us">美国</option>
<option value="eth"selected>瑞士</option>
<option value="india">印度</option>
</select>
</p>
<!--文本域
checked:代表列
rows:代表行
-->
<p>反馈:
<textarea name="textarea"cols="50"rows="10">文本内容</textarea>
</p>
<!--文件域
input type="file" name="files"
所有的input的标签和所有的表单元素都需要一个name属性-->
<p>
<input type="file"name="files">
<input type="button"value="上传"name="upioad">
</p>





</p>


<p>
<input type="submit">
<input type="reset"value="清空表单">
</p>


<!--提交:submit 重置:reset
进入之后输入名字和密码-进入我的第一个网页中“hello world“----显示username就是input的名字-->
</form>
</body>

</html>
posted @ 2022-04-02 20:50  LiLime  阅读(28)  评论(0)    收藏  举报