Day03

初识表单post和get提交

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>表单学习</title>
</head>
<body>
<h1>注册</h1>
<!--登录注册-->
<!--action:表单提交的位置,可以是网站,也可以是一个请求处理地址-->
<!--method:post,get提交方式
  get:可以在url中看到提交的信息,不安全,高效
   post:比较安全,传输大文件-->
<form action="1.初识.html" method="post">
<p>名字:<input type="text" name="username"></p>
<p>密码:<input type="password" name="pwd" ></p>
<p>
   <input type="submit">
   <input type="reset">
</p>
</form>
</body>
</html>

文本框和单选框,列表和多选框

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>表单学习</title>
</head>
<body>
<h1>注册</h1>
<!--登录注册-->
<!--action:表单提交的位置,可以是网站,也可以是一个请求处理地址-->
<!--method:post,get提交方式
  get:可以在url中看到提交的信息,不安全,高效
   post:比较安全,传输大文件
   value:默认初始值
   maxlength:最大长度
   size:文本框长度-->
<form action="1.初识.html" method="post">
   <p>名字:<input type="text" name="username" value="xcl" maxlength="8"size="30"></p>
   <p>密码:<input type="password" name="pwd" value="11111111" maxlength="9" size="30"></p>
<!--   单选框标签
<input type="radio"
value:单选框的值
name:表示组
checked表示默认选择-->
   <p>性别:<input type="radio" value="boy"name="sex" checked/>男
       <input type="radio" value="girl" name="sex">女
   </p>
<!--多选框-->
   <input type="checkbox" value="sleep" name="hobby">睡觉
   <input type="checkbox" value="code" name="hobby">敲代码
   <input type="checkbox" value="chat" name="hobby">聊天
   <input type="checkbox" value="game" name="hobby">游戏

   <p>
       <input type="submit">
       <input type="reset">重置
   </p>
   <br>
   <br>
   <br>
   <br>
   <br>
   <br>
   <p>按钮:
       <input type="button" name="btn1" value="点击边长">
       <input type="image" src="../resource/image/Default.jpg" width="100" height="100">
   </p>
</form>
</body>
</html>
<!--按钮:
imput type="button" 普通按钮
imput type="submit" 提交按钮
imput type="image"   图像按钮
imput type="reset"   重置   value可以给重置按钮赋名


-->

列表文本域和文件域

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>列表框文本域和文件域</title>
</head>
<body>
<form action="1.初识.html">
<!--下拉框,列表框
selected表示默认-->
<p>下拉框:
   <select name="列表名称" method="post">
       <option value="选项的值"selected>-------</option>
       <option value="china">中国</option>
       <option value="usa">美国</option>
       <option value="jp">日本</option>
       <option value="i">印度</option>
   </select>
</p>
<!--文本域
cols:行
rows:列-->
<p>反馈:
   <textarea name="textarea" id="" cols="50" rows="10">文本内容</textarea>
</p>
<p>
   <input type="file" name="files">
   <input type="button" value="上传" name="upload">
</p>
<p>
   <input type="submit" name="打开上传">
   <input type="reset">
</p>
</form>
</body>
</html>
 
posted @ 2022-10-03 17:08  宙斯xcl  阅读(118)  评论(0)    收藏  举报