title: 前端之from表单
author: 千里
tags:
- html
categories: - html
abbrlink: 2896
date: 2023-02-28 18:23:00
前端之from表单
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="">
姓名 <input type="text">
银行卡账户 <input type="text">
银行卡密码 <input type="text">
</form>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="post">
<p>姓名 <input type="text" name="ac"></p>
<p>银行卡账户 <input type="text" name="user"></p>
<p>银行卡密码 <input type="password" name="pwd"></p>
<p>
爱好:
<input type="checkbox" name="hobby" value="ikun">ikun
<input type="checkbox" name="hobby" value="lanqiu">篮球
</p>
<p><input type="submit"></p>
</form>
</body>
</html>
type= radio
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="post">
<p>姓名 <input type="text" name="ac"></p>
<p>银行卡账户 <input type="text" name="user"></p>
<p>银行卡密码 <input type="password" name="pwd"></p>
<p>
爱好:
<input type="checkbox" name="hobby" value="ikun">ikun
<input type="checkbox" name="hobby" value="lanqiu">篮球
<!键值一样可以发多个 >
</p>
<p>
性别:
<input type="radio" name="sex" value="1">男
<input type="radio" name="sex" value="0">女
<!键值一样只能发一个 >
</p>
<p><input type="submit"></p>
</form>
</body>
</html>
date
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="post">
<p>姓名 <input type="text" name="ac"></p>
<p>银行卡账户 <input type="text" name="user"></p>
<p>银行卡密码 <input type="password" name="pwd"></p>
<p>
爱好:
<input type="checkbox" name="hobby" value="ikun">ikun
<input type="checkbox" name="hobby" value="lanqiu">篮球
<!键值一样可以发多个 >
</p>
<p>
性别:
<input type="radio" name="sex" value="1">男
<input type="radio" name="sex" value="0">女
<!键值一样只能发一个 >
</p>
<p>
生日:
<input type="date" name="birth" value="9999-12-29">
</p>
<p><input type="submit"></p>
</form>
</body>
</html>
弹窗代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="post">
<p>姓名 <input type="text" name="ac"></p>
<p>银行卡账户 <input type="text" name="user"></p>
<p>银行卡密码 <input type="password" name="pwd"></p>
<p>
爱好:
<input type="checkbox" name="hobby" value="ikun">ikun
<input type="checkbox" name="hobby" value="lanqiu">篮球
<!键值一样可以发多个 >
</p>
<p>
性别:
<input type="radio" name="sex" value="1">男
<input type="radio" name="sex" value="0">女
<!键值一样只能发一个 >
</p>
<p>
生日:
<input type="date" name="birth" value="9999-12-29">
</p>
<p>
<input type="button" value="button" onclick="alert(666)">
</p>
<p><input type="submit"></p>
</form>
</body>
</html>
表单筛选
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="post">
<p>姓名 <input type="text" name="ac"></p>
<p>银行卡账户 <input type="text" name="user"></p>
<p>银行卡密码 <input type="password" name="pwd"></p>
<p>
爱好:
<input type="checkbox" name="hobby" value="ikun">ikun
<input type="checkbox" name="hobby" value="lanqiu">篮球
<!键值一样可以发多个 >
</p>
<p>
性别:
<input type="radio" name="sex" value="1">男
<input type="radio" name="sex" value="0">女
<!键值一样只能发一个 >
</p>
<p>
生日:
<input type="date" name="birth" value="9999-12-29">
</p>
<p>
<input type="button" value="button" onclick="alert(666)">
</p>
<p>
<select name="province" >
<option value="hebei">河北省</option>
<option value="henan">河南省</option>
<option value="shanxi">山西省</option>
<option value="shandong">山东省</option>
</select>
</p>
<p><input type="submit"></p>
</form>
</body>
</html>
文本框
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="post">
<p>姓名 <input type="text" name="ac"></p>
<p>银行卡账户 <input type="text" name="user"></p>
<p>银行卡密码 <input type="password" name="pwd"></p>
<p>
爱好:
<input type="checkbox" name="hobby" value="ikun">ikun
<input type="checkbox" name="hobby" value="lanqiu">篮球
<!键值一样可以发多个 >
</p>
<p>
性别:
<input type="radio" name="sex" value="1">男
<input type="radio" name="sex" value="0">女
<!键值一样只能发一个 >
</p>
<p>
生日:
<input type="date" name="birth" value="9999-12-29">
</p>
<p>
<input type="button" value="button" onclick="alert(666)">
</p>
<p>
<select name="province" >
<option value="hebei">河北省</option>
<option value="henan">河南省</option>
<option value="shanxi">山西省</option>
<option value="shandong">山东省</option>
</select>
</p>
<p>
<textarea name="jianjie" cols="30" rows="10" > </textarea>
</p>
<p><input type="submit"></p>
</form>
</body>
</html>
<p>姓名 <input type="text" name="ac" placeholder="请输入姓名"></p>
# checked 默认选中
<input type="checkbox" name="hobby" value="ikun" checked>ikun
# 下拉菜单默认选择
<option value="shanxi" selected>山西省</option>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="" method="post">
<p>姓名 <input type="text" name="ac" placeholder="请输入姓名"></p>
<p>银行卡账户 <input type="text" name="user"></p>
<p>银行卡密码 <input type="password" name="pwd"></p>
<p>
爱好:
<input type="checkbox" name="hobby" value="ikun" checked>ikun
<input type="checkbox" name="hobby" value="lanqiu">篮球
<!键值一样可以发多个 >
</p>
<p>
性别:
<input type="radio" name="sex" value="1">男
<input type="radio" name="sex" value="0">女
<!键值一样只能发一个 >
</p>
<p>
生日:
<input type="date" name="birth" value="9999-12-29">
</p>
<p>
<input type="button" value="button" onclick="alert(666)">
</p>
<p>
<select name="province" >
<option value="hebei" >河北省</option>
<option value="henan">河南省</option>
<option value="shanxi" selected>山西省</option>
<option value="shandong">山东省</option>
</select>
</p>
<p>
<textarea name="jianjie" cols="30" rows="10" > </textarea>
</p>
<p><input type="submit"></p>
</form>
</body>
</html>